0

Im trying to create a image editor using Jquery.. In case it is necessary to make multiple gradable images to the surface I use Jquery gradable. but it is working only for One object. when I added more than one gradable not working..

here is my code

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Draggable - Default functionality</title>
  <link rel="stylesheet" href="jquery-ui.css">
  <script src="jquery-1.10.2.js"></script>
  <script src="jquery-ui_1.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <style>
  .draggable {position: relative;}
  </style>

  <script>
  $(function() {
      d();
      r();
      function d(){
          $( ".draggable" ).draggable();
      }
      function r(){
          $( ".resizable" ).resizable();
      }

  });
  </script>
</head>
<body>
    <div class="ui-widget-content" style="width: 300px;height: 500px;">
        <img class="draggable resizable" src="t.jpeg" width="300" height="300" style="border: 1px dotted #ccc;"/>
        <img class="draggable resizable" src="logo.png" width="" height="" style="border: 1px dotted #ccc;"/>
        <div  class="draggable resizable">
            <p class="" style="border: 1px dotted #ccc;">Drag me around</p>
        </div>
    </div>
</body>
</html>
KBK
  • 375
  • 1
  • 4
  • 20
  • You can check the following link: [Multiple dragable](http://stackoverflow.com/questions/5677993/how-do-i-drag-multiple-elements-at-once-with-javascript-or-jquery) – rajausman haider Dec 08 '15 at 05:02
  • try destroying and reinitializing draggable everytime you add a new element. – Cerlin Dec 08 '15 at 05:38

1 Answers1

0

Try changing jQuery code to

jQuery(document).ready(function(){
 jQuery( ".draggable" ).draggable();
});
Aparna_29
  • 121
  • 2