javascript 模仿windows拖动 封装类
/**
* CreateDate 2011-8-22 18:34:34
*
* @type Javascript Document
*
* Description of moveElement.class
*
* @example drop.reg("span","div");
*
*/
var drop={
reg: function (handler, movediv, cursor) { // 注册鼠标移动的一些事件。
var isclick = false;
var clickleft = 0;
var clicktop = 0;
var target = this.$(handler);
var movediv = this.$(movediv);
movediv.style.position="absolute";
target.style.cursor = cursor || "move";
function clickdrop(e) { // 按下鼠标左键时的事件。
e = window.event || e; // 获取当前事件对象。
var tag=document.createElement("div")
tag.id="move";
tag.style.width=movediv.style.width;
tag.style.height=movediv.style.height;
tag.style.position="absolute";
tag.style.left=movediv.style.left;
tag.style.top=movediv.style.top;
document.getElementsByTagName("body")[0].appendChild(tag);
isclick = true; // 记录已经准备开始移动了。
clickleft = e.clientX - parseInt(movediv.style.left); // 记录当前坐标轴。
clicktop = e.clientY - parseInt(movediv.style.top);
}
function startdrop(e) { // 鼠标开始移动时的事件。
e = window.event || e; // 获取当前事件对象。
if (!isclick) return false; // 如果isclick不等于真了返回。
movediv.style.left=movediv.style.left?movediv.style.left:1;
movediv.style.top=movediv.style.top?movediv.style.top:1;
document.getElementById("move").style.border="1px dotted #000000"
document.getElementById("move").style.left = e.clientX - clickleft + "px"
document.getElementById("move").style.top= e.clientY - clicktop + "px";
}
function endrop(e) { // 释放鼠标左键时的事件。
e = window.event || e;
if (isclick) { // 如果isclick还为真那么就赋值为假。
movediv.style.left = e.clientX - clickleft + "px"; // 把鼠标当前移动的位置赋值给div
movediv.style.top = e.clientY - clicktop + "px"; // 当前位置减去开始位置就是层当前存放的位置。
document.getElementsByTagName("body")[0].removeChild(document.getElementById("move"))
if (this.isIE) movediv.releaseCapture(); //该函数从当前的窗口释放鼠标捕获,并恢复通常的鼠标输入处理。
isclick = false;
document.documentElement.onmousemove = null;
}
}
target.οnmοuseοver= clickdrop;
target.onmousedown = clickdrop; // 鼠标按下事件。
document.onmouseup = endrop; // 鼠标释放事件。
document.onmousemove = startdrop; // 鼠标移动事件。
// movediv.onselectstart = movediv.oncontextmenu = function () { return false; }; // 禁止选择和右键菜单。
},
isIE: (navigator.appName == "Microsoft Internet Explorer") || window.ActiveXObject, // 判断是否为IE。,
$:function (objectId)//获取id的函数
{
var id=null;
if(document.getElementById && document.getElementById(objectId)) {
// W3C DOM
id=document.getElementById(objectId);
} else if (document.all && document.all(objectId)) {
// MSIE 4 DOM
id=document.all(objectId);
} else if (document.layers && document.layers[objectId]) {
// NN 4 DOM.. note: var won't find nested layers
id=document.layers[objectId];
} else {
id="undefind";
}
return (id=="undefined" || id==null)?"\u672a能获取节点":id;
}
}
javascript 模仿windows拖动
最新推荐文章于 2024-03-31 16:30:54 发布