基于jquery的鼠標(biāo)拖動效果代碼
更新時間：2012年05月30日 14:37:41 作者：
因為鼠標(biāo)沒有拖動事件(按下鼠標(biāo)并移動)，只有按下，抬起，移動
記得在之前的一個"拖動層"的隨筆中，我實現(xiàn)拖動，是用的一個布爾變量,判斷是否可以拖動某元素。
這兩天看了一些東西，發(fā)現(xiàn)不需要設(shè)這個布爾變量;
實現(xiàn)過程：
按下鼠標(biāo)的時候，給文檔對象（當(dāng)然也可以是別的DOM對象）的移動事件綁定一個處理函數(shù)，同時也給鼠標(biāo)抬起時綁定一個解除的處理函數(shù)。
//按下鼠標(biāo)并移動時(拖動)，調(diào)用的函數(shù)；
function startSelection(event){
……
}
//解除移動時的處理函數(shù)；
function cancelSelection() {
$(document).unbind('mousemove', startSelection).unbind('mouseup', cancelSelection);
}
//鼠標(biāo)在按下時調(diào)用的函數(shù)
function imgMouseDown(event){
$(document).mousemove(startSelection).mouseup(cancelSelection);
}
$img.bind("mousedown",imgMouseDown)
這兩天看了一些東西，發(fā)現(xiàn)不需要設(shè)這個布爾變量;
實現(xiàn)過程：
按下鼠標(biāo)的時候，給文檔對象（當(dāng)然也可以是別的DOM對象）的移動事件綁定一個處理函數(shù)，同時也給鼠標(biāo)抬起時綁定一個解除的處理函數(shù)。
復(fù)制代碼 代碼如下:
//按下鼠標(biāo)并移動時(拖動)，調(diào)用的函數(shù)；
function startSelection(event){
……
}
//解除移動時的處理函數(shù)；
function cancelSelection() {
$(document).unbind('mousemove', startSelection).unbind('mouseup', cancelSelection);
}
//鼠標(biāo)在按下時調(diào)用的函數(shù)
function imgMouseDown(event){
$(document).mousemove(startSelection).mouseup(cancelSelection);
}
$img.bind("mousedown",imgMouseDown)
相關(guān)文章
這篇文章主要介紹了jQuery動態(tài)生成表格及右鍵菜單功能,結(jié)合實例形式分析了jQuery表格的動態(tài)操作及鼠標(biāo)事件響應(yīng)相關(guān)技巧,需要的朋友可以參考下2017-01-01
jQuery插件Validate實現(xiàn)自定義表單驗證
這篇文章主要介紹了jQuery插件Validate實現(xiàn)自定義表單驗證，自定義一個驗證方法，感興趣的小伙伴們可以參考一下2016-01-01
閑來無事做的一個Jquery實現(xiàn)仿騰訊微博發(fā)表廣播的特效，功能和樣子實現(xiàn)了，由于樣式是渣渣，所以小伙伴們想直接用的話，還得自己美化下2014-11-11
這篇文章主要介紹了jQuery動態(tài)改變多行文本框高度的方法,結(jié)合實例形式分析了jQuery響應(yīng)鼠標(biāo)事件動態(tài)修改頁面元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-09-09
用jquery實現(xiàn)動畫跳到頂部和底部(這個比較簡單)
用jquery實現(xiàn)動畫的跳到頂部和底部，當(dāng)點擊頂部按鈕的時候，執(zhí)行方法,scrollTop屬性獲取選中標(biāo)簽距滾動條的距離2014-09-09
這篇文章主要針對jQuery頁面刷新問題為大家進行詳細(xì)分析，包括局部刷新、全部刷新，感興趣的朋友可以參考一下2016-01-01
lyhucSelect基于Jquery的Select數(shù)據(jù)聯(lián)動插件
lyhucSelect基于Jquery的Select數(shù)據(jù)聯(lián)動插件，需要的朋友可以參考下。2011-03-03
快速回到頁首的方法有很多，在本文為大家介紹下使用jquery是如何做到的2013-12-12
這篇文章主要為大家詳細(xì)介紹了jQuery實現(xiàn)表單驗證，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
jQuery針對input的class屬性寫了多個值情況下的選擇方法
這篇文章主要介紹了jQuery針對input的class屬性寫了多個值情況下的選擇方法,結(jié)合實例形式對比分析了jQuery選擇器針對class屬性中有多個值情況下的選中方法,需要的朋友可以參考下2016-06-06