Response title
This is preview!
Hi all,
I
am using jquery for draging a div. still it working on div id base
but i want use as function like mydrag('div1'){ // } please
help me..
- <html><head>
- <meta http-equiv="content-type" content="text/html; charset=UTF-8">
- <title>Test File</title>
-
- <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
- <script type="text/javascript" src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>
-
- <style type="text/css">
- #canvas { width: 500px; height: 400px; background: #ccc; position: relative; margin: 2em auto; }
- #box { position: absolute; top: 0; left: 0; width: 100px; height: 100px; background: green; cursor: move; }
- </style>
-
- <script type="text/javascript">//<![CDATA[
- $(function(){
- var coordinates = function(element) {
- element = $(element);
- var top = element.position().top;
- var left = element.position().left;
- $(element).text('X: ' + left + ' ' + 'Y: ' + top);
- }
-
- function mydrag(id){
- $(id).draggable({
- start: function() {
- coordinates(id);
- },
- containment : "#canvas",
-
- stop: function() {
- coordinates(id);
- }
- });
- }
-
- });//]]>
-
- </script>
-
-
- </head>
-
- <body style="cursor: auto;">
- <div id="canvas">
- <div id="box" style="left: 189px; top: 134px;" onclick="mydrag('box');" ></div>
- </div>
- </body>
- </html>