CODEWITHSUNDEEP
javascriptjquery
Lennart
Lennart

Reputation: 1560

Jquery UI draggable wont drag first time

I have an image which when onmousedown is triggered, it runs a function that changes its class and makes it draggable, however the first time I drag it it wont drag, it changes the class but will not drag? After the intial failed drag, if you then drag again it will drag but why wont it drag at first?

function element_click(element_class) {
  $("#" + element_class).draggable("enable");
  $("." + element_class).addClass("element_select");
  $("#" + element_class).draggable({
    disabled: false,
    opacity: 0.9,
    revert: true,
    stop: function(event, ui) {
      $(".element_select").removeClass('element_select');
      $("#" + element_class).addClass(element_class);
      $("#" + element_class).draggable("disable");
    }
  });
}


<img id="element_air_1" style="z-index: 5;" class="element_air_1" 
 onmousedown="javascript: element_click('element_air_1')" 
src="Doodle God Elements/air.png">

Upvotes: 1

Views: 548

Answers (2)

Ricardo Casta&#241;eda
Ricardo Casta&#241;eda

Reputation: 5802

Add this block of code to your script:

window.onload = function(){
    element_click($('#element_air_1').attr('class'));   
}

It will trigger your script before your first click.

Upvotes: 0

James M
James M

Reputation: 16728

You're meant to make it draggable once when it's added to the DOM, before it gets dragged for the first time.

Upvotes: 2

Related Questions