1
我有一個div例如，當你拿起它開始拖動時，它捕捉div使光標/鼠標位於它的中間。請幫忙嗎？當元素被拖拽拾取時，它只能從中間拾取？
這是代碼..
// DEFINE DEFAULT VARIABLES
var _target=null, _dragx=null, _dragy=null, _rotate=null, _resort=null;
var _dragging=false, _sizing=false, _animate=false;
var _rotating=0, _width=0, _height=0, _left=0, _top=0, _xspeed=0, _yspeed=0;
var _zindex=1000;
jQuery.fn.touch = function(settings) {
// DEFINE DEFAULT TOUCH SETTINGS
settings = jQuery.extend({
animate: true,
sticky: false,
dragx: true,
dragy: true,
rotate: false,
resort: true,
scale: false
}, settings);
// BUILD SETTINGS OBJECT
var opts = [];
opts = $.extend({}, $.fn.touch.defaults, settings);
// ADD METHODS TO OBJECT
this.each(function(){
this.opts = opts;
this.ontouchstart = touchstart;
this.ontouchend = touchend;
this.ontouchmove = touchmove;
this.ongesturestart = gesturestart;
this.ongesturechange = gesturechange;
this.ongestureend = gestureend;
});
};
function touchstart(e){
_target = this.id;
_dragx = this.opts.dragx;
_dragy = this.opts.dragy;
_resort = this.opts.resort;
_animate = this.opts.animate;
_xspeed = 0;
_yspeed = 0;
$(e.changedTouches).each(function(){
var curLeft = ($('#'+_target).css("left") == 'auto') ? this.pageX : parseInt($('#'+_target).css("left"));
var curTop = ($('#'+_target).css("top") == 'auto') ? this.pageY : parseInt($('#'+_target).css("top"));
if(!_dragging && !_sizing){
_left = (e.pageX - curLeft);
_top = (e.pageY - curTop);
_dragging = [_left,_top];
if(_resort){
_zindex = ($('#'+_target).css("z-index") == _zindex) ? _zindex : _zindex+1;
$('#'+_target).css({ zIndex: _zindex });
}
}
});
};
function touchmove(e){
if(_dragging && !_sizing && _animate) {
var _lastleft = (isNaN(parseInt($('#'+_target).css("left")))) ? 0:parseInt($('#'+_target).css("left"));
var _lasttop = (isNaN(parseInt($('#'+_target).css("top")))) ? 0:parseInt($('#'+_target).css("top"));
}
$(e.changedTouches).each(function(){
e.preventDefault();
_left = (this.pageX-(parseInt($('#'+_target).css("width"))/2));
_top = (this.pageY-(parseInt($('#'+_target).css("height"))/2));
if(_dragging && !_sizing) {
if(_animate){
_xspeed = Math.round((_xspeed + Math.round(_left - _lastleft))/1.5);
_yspeed = Math.round((_yspeed + Math.round(_top - _lasttop))/1.5);
}
if(_dragx || _dragy) $('#'+_target).css({ position: "absolute" });
if(_dragx) $('#'+_target).css({ left: _left+"px" });
if(_dragy) $('#'+_target).css({ top: _top+"px" });
}
});
};
function touchend(e){
$(e.changedTouches).each(function(){
if(!e.targetTouches.length){
_dragging = false;
if(_animate){
_left = ($('#'+_target).css("left") == 'auto') ? this.pageX : parseInt($('#'+_target).css("left"));
_top = ($('#'+_target).css("top") == 'auto') ? this.pageY : parseInt($('#'+_target).css("top"));
var animx = (_dragx) ? (_left+_xspeed)+"px" : _left+"px";
var animy = (_dragy) ? (_top+_yspeed)+"px" : _top+"px";
if(_dragx || _dragy) $('#'+_target).animate({ left: animx, top: animy }, "fast");
}
}
});
setTimeout(changeBack,5000,_target);
};
function gesturestart(e){
_sizing = [$('#'+this.id).css("width"), $('#'+this.id).css("height")];
};
function gesturechange(e){
if(_sizing){
_width = (this.opts.scale) ? Math.min(parseInt(_sizing[0])*e.scale, 300) : _sizing[0];
_height = (this.opts.scale) ? Math.min(parseInt(_sizing[1])*e.scale, 300) : _sizing[1];
_rotate = (this.opts.rotate) ? "rotate(" + ((_rotating + e.rotation) % 360) + "deg)" : "0deg";
$('#'+this.id).css({ width: _width+"px", height: _height+"px", webkitTransform: _rotate });
}
};
function gestureend(e){
_sizing = false;
_rotating = (_rotating + e.rotation) % 360;
};
當您開始拖移，而不是當你第一次點擊下這纔會發生。
有人告訴我改：
_left = (this.pageX-(parseInt($('#'+_target).css("width"))/2));
_top = (this.pageY-(parseInt($('#'+_target).css("height"))/2));
到：
_left = (this.pageX);
_top = (this.pageY);
但是，這只是使得它從頂部回暖。
如何使它從鼠標點擊的位置拾取？
編輯： 這是iPad和它不工作的計算機上測試.. 但任何幫助將是巨大的，即時通訊卡