CODEWITHSUNDEEP
javascriptjqueryjquery-uidrag-and-dropdraggable
user5844810
user5844810

Reputation:

how to stop drag event on double click in jquery

currently i am using jquery draggable function https://jqueryui.com/draggable/ . 

$( ".myclass").draggable({ });

But i want to stop the drag event when the user double click on the dragging element . How to do this ?. Is it [possible to stop dragging in single click ? For some reason my dragging element is come with mouse pointer and i cannot stop dragging .

Thank you .

Upvotes: 0

Views: 1665

Answers (1)

jyloo
jyloo

Reputation: 103

Draggable should stop automatically when you release your mouse.

HTML

<body>
<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
  <p id="position"></p>
  <p id="event"></p>
</div>
</body>

JS

$( function() {
    $( "#draggable" ).draggable({
      scroll: false,
      drag: function( event, ui ) {
        $('#position').html(
          'Left : ' + ui.position.left + '<br/>' +
          'Top : ' + ui.position.top
        );
      },
      start: function( event, ui ) {
        $('#event').html("Dragging");
      },
      stop: function( event, ui ) {
        $('#event').html("Stopped");
      }
    });
  } );

Try the sample above. The dragstop event is automatically called every time you release your mouse from dragging. Try apply this in your code to further investigate why the dragstop is not being called in your case.

http://codepen.io/jyloo/pen/mrZmjO

Upvotes: 1

Related Questions