ホームページ >ウェブフロントエンド >jsチュートリアル >IE および Firefox_javascript スキルと互換性のある、レイヤーをドラッグするためのクールな JS クラス

IE および Firefox_javascript スキルと互換性のある、レイヤーをドラッグするためのクールな JS クラス

WBOY
WBOYオリジナル
2016-05-16 18:51:031089ブラウズ

インターネット上の JS ドラッグ クラスを最適化および修正し、ドラッグ時に半透明の特殊効果を追加しました。 http://www.jb51.net/article/16122.htm
このカテゴリの Cminfo クラスを確認してください:
http:/ /www.jb51.net/article/18760.htm

コードをコピー コードは次のとおりです。

//************************************レイヤー移動機能開始** ** *******************************************
//生成中ドラッグ レイヤーは非常に単純です。必要なだけです (パラメータの 1 つが配列の場合、部分的なドラッグを意味し、arr[0] はドラッグ レイヤーを意味し、arr[1] は全体的なドラッグを意味します)
//new divDrag(['test '], [getObject('test31' ),getObject('test3')], getObject('test1') ,getObject('test2') ,[getObject('test41'),getObject('test4')]);
//属性レイヤーの位置:absolute;
Array.prototype.extend = function(C){for(var B=0,A=C.length;Bfunction divDrag()
{
var A,B,gCn;
var zIndex = 1;
this.dragStart = function (e)
{
e = e||window.event
if((e.that && (e.that!=1))||(e.button && (e.button! =1))){return ;}
var pos = this.gPos;
gCn = this.parent||this;
if(document.defaultView)
_top = document.defaultView.getComputedStyle ( gCn, null).getPropertyValue("top");
_left = document.defaultView.getComputedStyle(gCn,null).getPropertyValue("left");
🎜> = (e .pageX||(e.clientX document.documentElement.scrollLeft))-parseInt(_left) (_top);
if(!!A)
if(document.removeEventListener)
("mousemove" ,A,false);
document.removeEventListener("mouseup",B,false);
document.detachEvent("onmouseup",B ); A,false);
document.addEventListener("mouseup",B,false);
else
{
document.attachEvent("onmousemove",A); "onmouseup",B);
gCn.style.zIndex = (zIndex);
this.dragMove = function(e)
{
e = e||window.event;
var pos = this.gPos;
gCn = this.parent||this;
gCn.style.top = (e.pageY||(e.clientY document.documentElement.scrollTop))-parseInt(pos.oy) 'px';
gCn.style.left = (e.pageX||(e.clientX document.documentElement.scrollLeft))-parseInt(pos.ox) 'px';
try{if(CMInfo.Bs_Name=='IE'){gCn.style.filter = "alpha(opacity=70)";}else{gCn.style.opacity = "0.7";}}catch(e ){}
this.stop(e);
}
this.dragEnd = function(e)
{
var pos = this.gPos;
e = e||window.event;
if((e.that && (e.that!=1))||(e.button && (e.button!=1))){return};
gCn = this.parent||this;
if(!!(this.parent)){this.style.backgroundColor = pos.color;}
try{if(CMInfo.Bs_Name=='IE'){gCn.style.filter = "alpha (opacity=100)";}else{gCn.style.opacity = 1;}}catch(e){}
if(document.removeEventListener)
{
document.removeEventListener("mousemove", A、偽);
document.removeEventListener("mouseup",B,false);
}
else
{
document.detachEvent("onmousemove",A);
document.detachEvent("onmouseup",B);
}
A = null;
B = null;
gCn.style.zIndex = ( zIndex);
this.stop(e);
}
this.shiftColor = function()
{
this.style.backgroundColor="#EEEEEE";                                    
}
this.position = function (e)
{
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent)
{
t = e.offsetTop;
l = e.offsetLeft;
}
return {x:l,y:t,ox:0,oy:0,color:null}
}
this.stop = function(e)
{
if(e.stopPropagation){e.stopPropagation();}else{e.cancelBubble=true;}
if(e.preventDefault){e.preventDefault();}else{e.returnValue=false;}
}
this.create = function(bind)
{
var B = this;
var A = バインド;
return function(e){return B.apply(A,[e]);}
}
this.dragStart.create = this.create;
this.dragMove.create = this.create;
this.dragEnd.create = this.create;
this.shiftColor.create = this.create;
this.initialize = function()
{
for(var A=0,B=arguments.length;A {
C=arguments[A];
if(!(C.push)){C = [C];}
gC = (typeof(C[0])=='オブジェクト')?C[0]:(typeof(C[ 0])=='文字列'?getObject(C[0]):null);
if(!gC){続行};
gC.gPos = this.position(gC);
gC.dragMove = this.dragMove;
gC.dragEnd = this.dragEnd;
gC.stop = this.stop;
if(!!C[1])
{
gC.parent = C[1];
gC.gPos.color = gC.style.backgroundColor;
}
if(gC.addEventListener)
{
gC.addEventListener("mousedown",this.dragStart.create(gC),false);
if(!!C[1]){gC.addEventListener("mousedown",this.shiftColor.create(gC),false);    }
}
else
{
gC.attachEvent("onmousedown",this.dragStart.create(gC));
if(!!C[1]){gC.attachEvent("onmousedown",this.shiftColor.create(gC));}
}
}
}
this.initialize .apply(this,arguments);
}
//**********************************移動层関数数结束**** ***************************************
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。