Как мне переложить это на jQuery?

[сiparis]

Здраствуйте,
Прошу помочь мне разобраться с событиями.
Есть к примеру код, в сумме, который выполняет перетаскивание елемента.
Суть в том, что я немогу понять как мне переложить это на jQuery.

var x = 0, drag = 0, elem = document.getElementById('move');

elem.onmousedown = function(event){
   event = event || window.event;
   x = event.clientX+document.body.scrollLeft-parseInt(elem.style.left);
   drag=true;
}
elem.ondragstart = function() {
   return false;
}

document.onmouseup = function() {
   drag = false;
}
document.onmousemove = function(event) {
   event = event || window.event;
   if(drag){
      elem.style.left=event.clientX+document.body.scrollLeft-x;
   }
}

Попробвал преобразовать, но почему-то безуспешно

var x = 0, drag = 0, elem = $('#move');
elem.mousedown(function(event){
   x = event.clientX+document.body.scrollLeft-parseInt(elem.style.left);
   drag=true;
});

elem.dragstart(function(event){
   return false;
});

document.mouseup(function(event){
   drag = false;
});

document.mousemove(function(event){
   if(drag){
      elem.style.left = event.clientX+document.body.scrollLeft-x;
   }
});

Объясните на каком этапе я допустил ошибку?


Неужели, чтобы сделать простой drag & drop из 10 строчек, нужно подключать UI.

[inGray]

Можно нескромный вопрос? А зачем?

[сiparis]

Ну какбы хочу понять/разобраться почему чтобы сделать элементарный drag & drop на jQuery нужно подключить тонну кода UI, а не сделать это просто как на чистом JavaScript.

Реально не понимаю почему не работает вышеприведенный код, буду раз если разьясните

[inGray]

Не до конца jQuery используете.. Не понимаю зачем вообще на jQuery переписывать, если он и так минимален? Меньше он не станет...

ЗЫ У Объекта Document нет методов mouseup, mousemove... Ну и фаербаг вам в помощь.

[сiparis]

Рабочий пример:

<script type="text/javascript">
window.onload = function() {
   var x = 0, drag = 0, elem = document.getElementById('move');

   elem.onmousedown = function(event){
      event = event || window.event;
      x = event.clientX+document.body.scrollLeft-parseInt(elem.style.left);
      drag = true;
   };

   elem.ondragstart = function() {
      return false;
   };

   document.onmouseup = function() {
      drag = false;
   };

   document.onmousemove = function(event) {
   event = event || window.event;
      if(drag){
      elem.style.left = event.clientX+document.body.scrollLeft-x + "px";
      }
   };
};
</script>
<img src="http://www.linkexchanger.su/forum/download/file.php?avatar=2_1263474815.jpg" style="position:absolute; top:100; left:100;" id="move" />

Мне ради интереса, хочется знать почему не получается перевести вышепредставленный код на jQuery.

PS: Document c обработчиками событий дружит прекрасно и firebag, это не считает за ошибку

[inGray]

Метод onmousemove есть, а mousemove?

[сiparis]

Метод onmousemove есть, а mousemove?

в каком смысле? jQuery mousemove()

[сiparis]

Вроде бы разобрался