Div 拖拽

来源:互联网 发布:windows 7 字体在哪 编辑:程序博客网 时间:2024/06/09 22:10
/**
 * 定义拖拽框插件
 */
(function($){
var zIndex=999;
$.extend($.fn,{
draggable:function(settings){
var defaults={
handler:''
};//默认值
$.extend(defaults,settings);
var target=this;
var handler=defaults.handler==''?target:target.find(defaults.handler);
//处理拖拽,三个事件

var isPress=false;//判断鼠标状态
var offset_x,offset_y;
//1.鼠标按下
handler.bind("mousedown",function(e){
target.css("z-index",zIndex++);
isPress=true;
offset_x=e.pageX-target.offset().left;
offset_y=e.pageY-target.offset().top;
handler[0].setCapture && handler[0].setCapture();
return false;
})
//2.鼠标移动
$(document).bind("mousemove",function(e){
if(isPress==true){
target.css("left",e.pageX-offset_x);
target.css("top",e.pageY-offset_y);
}
})
//3.鼠标松开
handler.bind("mouseup",function(e){
isPress=false;
// handler[0].releaseCapture();
e.cancelBubble=true;//停止冒泡
})

}
})
})(jQuery)
0 0