日期:2014-05-16 浏览次数:20545 次
//最大z-index var 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(" "); }; }, onDrag:function(fn){ onDragFn = fn; isOnDrag = true; }, onMove:function(fn){ onMoveFn = fn; isMove = true; } }); $.extend({ //获得鼠标坐标 getMousePosition: function(e) { var posx =