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();
});
}