jquery外掛 - EasyDrag 簡單拖動欄

解決了EasyDrag這個Jquery外掛沒有指定拖動的handle的問題。這可是個大問題，儘管EasyDrag是個非常輕巧又實用的外掛，但沒有拖動的handle使我決定放棄它而選用臃腫的interface。那是多麼痛苦的選擇……

EasyDrag可以指定DOM中某個元素，使其可以用滑鼠進行拖放操作。假設DOM中有一個元素：

。那麼這樣讓它支援拖放：

$(”#box1″).easydrag();

如果想得到元素的位置值，可以用EasyDrag的ondrop方法CallBack回一個物件，如：

$(”#box1″).ondrop(function(a){ alert(a.x+’,'+a.y); });

操作很簡單，但有個問題，就是滑鼠在元素中任何範圍內都可以對元素進行拖動。如果元素中有一個滾動條或按鈕就麻煩了！滑鼠只要一點動滾動條或按鈕，整個元素就會永遠跟著滑鼠指標，象塊風溼貼膏一樣甩都甩不掉……

木野狐解決了這個問題，他擴充套件了這個外掛，指定一個元素為拖動的handle。把這個元素嵌入被拖動的元素中，滑鼠只在handle範圍內才可以拖動整個元素。比如：

$(”#box1″).easydrag(false,["darghandle"]);

這樣就完美了。

 

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/12639172/viewspace-553566/，如需轉載，請註明出處，否則將追究法律責任。