生活随笔
收集整理的這篇文章主要介紹了
jQuery实现拖动
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
jQuery實現拖動
思路：
定位：給要拖動的對象設置一個定位（position：aboselute);坐標：使用event.clientX、event.clientY獲取鼠標位置，使用obj.offset().left、obj.offset().top獲取對象離瀏覽器左上角的坐標；事件：mousedown,mouseup,mousemove三大鼠標事件；事件綁定與移除：bind()和unbind()；鼠標鍵的判斷：使用event.button可以獲得鼠標碼（0：左鍵，1：滑輪，2：右鍵）代碼如下：
function drag(obj) //obj為需要拖動DOM的jQuery對象{obj.bind(
"mousedown",start);
function start(event){if(event.button ==
0){deltaX = event.clientX - obj.offset().left;deltaY = event.clientY - obj.offset().top;$(document).bind(
"mousemove",move);$(document).bind(
"mouseup",stop);}
return false;}
function move(event){obj.css({
"left":(event.clientX-deltaX)+
'px',
"top":(event.clientY-deltaY)+
'px'});
return false;}
function stop(){$(document).unbind(
"mousemove",move);$(document).unbind(
"mouseup",stop);
return false;}}
總結
以上是生活随笔為你收集整理的jQuery实现拖动的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
