jquery 設置頁面元素可拖動效果

使用：

setEleDrag('.go_manager_vote',120,60,function(){
?? ?console.log('執行點擊操作');
});

// 頁面元素可拖動 // ele : $('.class') 或 $('#id') // _w : 元素寬 // _h : 元素高 // callback : 點擊執行的回調 function setEleDrag(ele,_w,_h,callback){// 點擊if(callback){$(ele).on('click', function(e) {callback();});}var sT, sL, wW, wH;$(ele).on('touchstart', function(e) {// e.preventDefault();sT = parseFloat($(window).scrollTop());sL = parseFloat($(window).scrollLeft());wW = parseFloat($(window).width()) - _w;wH = parseFloat($(window).height()) - _h;});$(ele).on('touchmove', function(e) {e.preventDefault();var touch = e.originalEvent.targetTouches[0];var x = touch.pageX - _w/2 - sL;var y = touch.pageY - _h/2 - sT;// console.log(x , y);x = x < 0 ? 0 : (x > wW ? wW : x);y = y < 0 ? 0 : (y > wH ? wH : y);// console.log(x , y);var theThis = $(this);theThis.css({'position': 'fixed','left': x,'top': y});});$(ele).on('touchend', function(e) {// e.preventDefault();}); }

?

總結

以上是生活随笔為你收集整理的jquery 设置元素拖动效果的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。