自己写的拖动层插件
基于Jquery 功能大体可用但可能有BUG
JScript code//最大z-indexvar maxZ_index = 0;//是否启用onDrag回调函数var isOnDrag = false;//onDrag回调函数var onDragFn = {};//是否启用拖动时的回调函数var isMove = false;//onMove回调函数var onMoveFn = {};jQuery.fn.extend({ Drag: function(DragId) { //鼠标是否按下 var isdown = false; //鼠标位置对象 var MousePosition = {}; //鼠标位置心对象 var NewMousePosition = {}; //拖动此obj有用 var obj = {}; //可移动最大div var fObj = $(this); //判断是否传入DragId if (DragId == undefined) { obj = $(this); } else { obj = $("#" + DragId); }; $(document).mousemove(function(e) { if (isdown) { NewMousePosition = $.getMousePosition(e); var left = fObj.css("left"); if (left == "auto") { left = 0; } else { left = left.replace("px", ""); }; var top = fObj.css("top").replace("px", ""); if (top == "auto") { top = 0; } else { top.replace("px", ""); }; fObj.css("left", (Number(left) + NewMousePosition.l - MousePosition.l) + "px"); fObj.css("top", (Number(top) + NewMousePosition.t - MousePosition.t) + "px"); MousePosition = NewMousePosition; if(isMove){ onMoveFn(left,top,NewMousePosition,fObj); }; }; }); obj.mousedown(function(e) { isdown = true; MousePosition = $.getMousePosition(e); //设置maxZ_index if(fObj.css("z-index") <= maxZ_index){ maxZ_index++; fObj.css("z-index",maxZ_index); }; //设置层的浮动 fObj.css("position", "absolute"); //给层定位到层的原有位置 if(fObj.css("left")=="auto"){ fObj.css("left",fObj.attr("offsetLeft")); }; if(fObj.css("top")){ fObj.css("top",fObj.attr("offsetTop")); }; fObj.css("filter","Alpha(opacity=50)"); fObj.css("opacity","0.5"); if(fObj.css("background-color") == "transparent"){ fObj.css("background-color","White"); }; }).mouseup(function() { isdown = false; if(isOnDrag){ onDragFn(fObj.css("left").replace("px", ""),fObj.css("top").replace("px", ""),fObj); } fObj.css("filter",""); fObj.css("opacity",""); }).css("cursor", "move");//设置鼠标手势 //设置z-index if(fObj.css("z-index") == "auto"){ fObj.css("z-index","1"); }; if(fObj.css("z-index") > maxZ_index){ maxZ_index = fObj.css("z-index"); }; if(fObj.html().replace(/(^\s*)|(\s*$)/g, "") == ""){ fObj.html("&nbsp;"); }; }, onDrag:function(fn){ onDragFn = fn; isOnDrag = true; }, onMove:function(fn){ onMoveFn = fn; isMove = true; }});$.extend({ //获得鼠标坐标 getMousePosition: function(e) { var posx = 0; var posy = 0; if (!e) var e = window.event; if (e.pageX || e.pageY) { posx = e.pageX; posy = e.pageY; } else if (e.clientX || e.clientY) { posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; }; return { l: posx, t: posy }; }});