很有意思的穿墙原生js的封装

2016-12-10  本文已影响0人  飘飞而过学

functiongetDir(obj,ev){

varx=obj.offsetLeft+obj.offsetWidth/2-ev.clientX;

vary=obj.offsetTop+obj.offsetHeight/2-ev.clientY;

//Math.atan2(y,x)      角度

//*180/Math.PI    角度转弧度

//+180              变成360

// /90          求数字 0 - 4之间

//Math.round      四舍五入后有五个值 0 1 2 3 4

// %4         为的结果 的到 0 1 2 3

returnMath.round((Math.atan2(y,x)*180/Math.PI+180)/90)%4;

}

functionthrough(obj){

varoLi=obj.children[0];

obj.onmouseenter=function(ev){

varoEvent=ev||event;

vardir=getDir(obj,oEvent);

switch(dir){

case0:

oLi.style.left='200px';

oLi.style.top=0;

break;

case1:

oLi.style.left=0;

oLi.style.top='200px';

break;

case2:

oLi.style.left='-200px';

oLi.style.top=0;

break;

case3:

oLi.style.left=0;

oLi.style.top='-200px';

break;

}

move(oLi,{left:0,top:0});

};

obj.onmouseleave=function(ev){

varoEvent=ev||event;

vardir=getDir(obj,oEvent);

switch(dir){

case0:

move(oLi,{left:200,top:0});

break;

case1:

move(oLi,{left:0,top:200});

break;

case2:

move(oLi,{left:-200,top:0});

break;

case3:

move(oLi,{left:0,top:-200});

break;

}

};

}

window.onload=function(){

varaUl=document.getElementsByTagName('ul');

for(vari=0;i

through(aUl[i]);

}

};

上一篇下一篇

猜你喜欢

热点阅读