>웹 프론트엔드 >JS 튜토리얼 >IE 및 Firefox_javascript 기술과 호환되는 레이어 드래그를 위한 멋진 js 클래스

IE 및 Firefox_javascript 기술과 호환되는 레이어 드래그를 위한 멋진 js 클래스

WBOY
WBOY원래의
2016-05-16 18:51:031080검색

인터넷에서 JS 드래그 클래스를 최적화 및 수정하고 드래그 시 반투명 특수 효과를 추가했습니다. http://www.jb51.net/article/16122.htm
참고, 이 카테고리의 Cminfo 클래스를 확인하세요:
http:/ /www.jb51.net/article/18760.htm

코드 복사 코드는 다음과 같습니다.

//************************************레이어 이동 기능 시작** ** ******************************************
//생성 중 드래그 레이어는 매우 간단합니다. 그냥 필요합니다(매개변수 중 하나가 배열이면 부분 드래그를 의미하고, 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.which && (e.which!=1))|(e.button && (e.button! =1))){return ;}
var pos = this.gPos;
gCn = this.parent||this;
if(document.defaultView)
_top = document.defaultView.getComputeStyle ( gCn, null).getPropertyValue("top");
_left = document.defaultView.getCompulatedStyle(gCn,null).getPropertyValue("left"); if( gCn.currentStyle)
                             ~            = (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 ) 🎜> {
document.addEventListener("mousemove", 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.which && (e.which!=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 (불투명도=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 = 함수(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 = 바인딩;
        반환 함수(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])=='string'?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으로 문의하세요.