ele.parentNode.removeChild(ele);
// 修改完毕，显示
Util.show();
if (Util.isOpera) {
// Opera的现实问题，要隐藏/显示后才能刷新出变化
document.body.style.display = " none " ;
document.body.style.display = "" ;
}
return returnValue;
};
// 可拖拽Element的原形，用来将event绑定到各个钩子，这部分市比较通用的，netvibes也是基本完全相同的实现
// 这部分推荐看dindin的这个，也会帮助理解，http://www.jroller.com/page/dindin/?anchor=pro_javascript_12
var Drag = {
// 对这个element的引用，一次只能拖拽一个Element
obj: null ,
// element是被拖拽的对象的引用，elementHeader就是鼠标可以拖拽的区域
init: function (elementHeader, element) {
// 将start绑定到onmousedown事件，按下鼠标触发start
elementHeader.onmousedown = Drag.start;
// 将element存到header的obj里面，方便header拖拽的时候引用
elementHeader.obj = element;
// 初始化绝对的坐标，因为不是position=absolute所以不会起什么作用，但是防止后面onDrag的时候parse出错了 字串7
if (isNaN(parseInt(element.style.left))) {
element.style.left = " 0px " ;
}
if (isNaN(parseInt(element.style.top))) {
element.style.top = " 0px " ;
}
// 挂上空Function，初始化这几个成员，在Drag.init被调用后才帮定到实际的函数，可以参照draggable里面的内容
element.onDragStart = new Function();
element.onDragEnd = new Function();
element.onDrag = new Function();
},
// 开始拖拽的绑定，绑定到鼠标的移动的event上
start: function (event) {
var element = Drag.obj = this .obj;
// 解决不同浏览器的event模型不同的问题
event = Drag.fixE(event);
// 看看是不是左键点击
if (event.which != 1 ) {
// 除了左键都不起作用
return true ;
}
// 参照这个函数的解释，挂上开始拖拽的钩子
element.onDragStart();
// 记录鼠标坐标
element.lastMouseX = event.clientX; 字串3
element.lastMouseY = event.clientY;
// 将Global的event绑定到被拖动的element上面来
document.onmouseup = Drag.end;
document.onmousemove = Drag.drag;
return false ;
},
// Element正在被拖动的函数
drag: function (event) {
// 解决不同浏览器的event模型不同的问题
event = Drag.fixE(event);
// 看看是不是左键点击
if (event.which == 0 ) {
// 除了左键都不起作用
return Drag.end();
}
// 正在被拖动的Element
var element = Drag.obj;
// 鼠标坐标
var _clientX = event.clientY;
var _clientY = event.clientX;
// 如果鼠标没动就什么都不作
if (element.lastMouseX == _clientY && element.lastMouseY == _clientX) {
return false ;
}
// 刚才Element的坐标
var _lastX = parseInt(element.style.top); 字串9
var _lastY = parseInt(element.style.left);
// 新的坐标
var newX, newY;
// 计算新的坐标：原先的坐标 鼠标移动的值差
newX = _lastY _clientY - element.lastMouseX;
newY = _lastX _clientX - element.lastMouseY;
// 修改element的显示坐标
element.style.left = newX " px " ;
element.style.top = newY " px " ;
// 记录element现在的坐标供下一次移动使用
element.lastMouseX = _clientY;
element.lastMouseY = _clientX;
// 参照这个函数的解释，挂接上Drag时的钩子
element.onDrag(newX, newY);
return false ;
},
// Element正在被释放的函数，停止拖拽
end: function (event) {
// 解决不同浏览器的event模型不同的问题
event = Drag.fixE(event);
// 解除对Global的event的绑定
document.onmousemove = null ;
document.onmouseup = null ;
// 先记录下onDragEnd的钩子，好移除obj
字串9
var _onDragEndFuc = Drag.obj.onDragEnd();
// 拖拽完毕，obj清空
Drag.obj = null ;
return _onDragEndFuc;
},
// 解决不同浏览器的event模型不同的问题
fixE: function (ig_) {
if ( typeof ig_ == " undefined " ) {
ig_ = window.event;
}
if ( typeof ig_.layerX == " undefined " ) {
ig_.layerX = ig_.offsetX;
}
if ( typeof ig_.layerY == " undefined " ) {
ig_.layerY = ig_.offsetY;
}
if ( typeof ig_.which == " undefined " ) {
ig_.which = ig_.button;
}
return ig_;
}
};
// 下面是初始化的函数了，看看上面这些东西怎么被调用
var _IG_initDrag = function (el) {