标签：javascript视频教程,javascript教程下载,
JavaScript 拖动布局dragFix,
//_dragFix.Obj.style.width = $(_dragFix.Row).offsetWidth;
//_dragFix.Temp.style.height = _dragFix.Obj.offsetHeight;
//window.status = "所在列："+_dragFix.Row;
_dragFix.Obj.style.top = (_dragFix.Obj.initoffsetY + currenY - _dragFix.Obj.initMouseY) + "px";
var finded = false;
var dragC = $(_dragFix.Row).childNodes;
for(var i = 0; i < dragC.length; i++)
{
var o = dragC[i];
var sonT = getRealTop(o);
var sonH = o.offsetHeight;
var tH = sonT + parseInt(sonH/2);
var tH2 = sonT + sonH;
if(o.getAttribute("drag"))
{
if(currenObjY > sonT && currenObjY < tH)
{
$(_dragFix.Row).insertBefore(_dragFix.Temp,o);
break;
}
else if(currenObjY > tH && currenObjY < tH2 + 8)
{
if(o.nextSibling) $(_dragFix.Row).insertBefore(_dragFix.Temp,o.nextSibling);
else $(_dragFix.Row).appendChild(_dragFix.Temp);
break;
}
// else if()
}
}
// if(!finded) $(_dragFix.Row).appendChild(_dragFix.Temp);
return;
},
end:function()
{
if(!_dragFix.Ctrl || !_dragFix.Sign) return;
_dragFix.Sign = false;
_dragFix.timer = _dragFix.repos(150,15);//放开时回到新的位置
window.status = "拖动结束";
},
repos:function(aa,ab)
{
var tl=getRealLeft(_dragFix.Obj);
var tt=getRealTop(_dragFix.Obj);
var kl=(tl-getRealLeft(_dragFix.Temp))/ab;
var kt=(tt-getRealTop(_dragFix.Temp))/ab;
return setInterval(function(){
if(ab<1)
{
clearInterval(_dragFix.timer);
_dragFix.Temp.parentNode.insertBefore(_dragFix.Obj,_dragFix.Temp);
_dragFix.Obj.parentNode.removeChild(_dragFix.Temp);
with(_dragFix.Obj.style)
{
position = "";
zIndex = "";
width = "100%";
}
return;
}
ab--;
tl-=kl;
tt-=kt;
_dragFix.Obj.style.left=parseInt(tl)+"px";
_dragFix.Obj.style.top=parseInt(tt)+"px";
},aa/ab);
},
stop:function()
{
if(!_dragFix.Root)
{
windowCDtatus = "拖动未开启";
return;
}
var dragC = _dragFix.Root.getElementsByTagName("DIV");
for(var i = 0; i < dragC.length; i++)
{
if(dragC[i].getAttribute("drag") == "yes")
{
var o = dragC[i].firstChild;
dragC[i].firstChild.style.cursor = "";
}
}//获取所有可拖动的对象
_dragFix.Ctrl = false;
window.status = "拖动已关闭";
}
}
function $(id) {return document.getElementById(id);}
function getT(e){return e.target || e.srcElement;}
function getMouseX(e){
return e.pageX ? e.pageX : e.clientX + document.body.scrollLeft - document.body.clientLeft;
}
function getMouseY(e){
return e.pageY ? e.pageY : e.clientY + document.body.scrollTop - document.body.clientTop;
}
function getRealLeft(o){
var l = 0;
while(o){
l += o.offsetLeft - o.scrollLeft;
o = o.offsetParent;
}
return(l);
}
function getRealTop(o){
var t = 0;
while(o){
t += o.offsetTop - o.scrollTop;
o = o.offsetParent;
}
return(t);
}
function cleanWhitespace(node) {
var notWhitespace = /S/;
for (var i=0; i < node.childNodes.length; i++) {
var childNode = node.childNodes[i];
if ((childNode.nodeType == 3)&&(!notWhitespace.test(childNode.nodeValue))) {
node.removeChild(node.childNodes[i]);
i--;
}
if (childNode.nodeType == 1) {
cleanWhitespace(childNode);
}
}
}//去除容器中的空白
</script>
</head>
<body >
<!--头部开始-->
<div id="pm_header"> </div>
<!--头部结束-->
<!--主体部分开始-->
<div id="pm_main">
<div id="main_left">
<div id="drag1" drag="yes" range="in">
<div class='system_header_bar' header='yes'>
<span>只能在此列拖动</span>
<a href="#" class="button_del" title="关闭" >X</a>
</div>
<div class="system_header_content">
<div class="one"><span style='color:red'>只能在此列拖动</span></div>
</div>
上一页 [1] [2] [3] 下一页
，JavaScript 拖动布局dragFix
