Draggable 










Allow elements to be moved using the mouse.










Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.






Source Code:











1



2



3



4



5



6



7



8



9



10



11



12



13



14



15



16



17



18



19



20



21



22



23



24



25



26



27





<!doctype html>







<html lang="en">







<head>







  <meta charset="utf-8">







  <title>jQuery UI Draggable - Default functionality</title>



<link rel="stylesheet" 

href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">







  <script src="//code.jquery.com/jquery-1.10.2.js"></script>







  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>







  <link rel="stylesheet" href="/resources/demos/style.css">







  <style>







  #draggable { width: 150px; height: 150px; padding: 0.5em; }







  </style>







  <script>







  $(function() {







    $( "#draggable" ).draggable();







  });







  </script>







</head>







<body>







 







<div id="draggable" class="ui-widget-content">







  <p>Drag me around</p>







</div>







 







 







</body>







</html>


























0
comments:
        
















Post a Comment




















        

      












Subscribe to:
Posts (Atom)

































Loading...