JS简单浮动碰撞效果

来源:互联网 发布:淘宝 各地博物馆 编辑:程序博客网 时间:2024/05/22 05:27
<html><head><title>小太阳碰撞效果</title><script language="javascript"><!--directX=1;  //X轴方向directY=1;  //Y轴方向sunX=0;sunY=0;function sunMov(){//定两个方向sunX+=directX*2;sunY+=directY*2;//修改div的left topsundiv.style.top=sunY+"px";sundiv.style.left=sunX+"px";//判断什么时候,转变方向//x方向(offestWidth可以返回,当前这个对象的实际宽度)if(sunX+sundiv.offsetWidth>=document.body.clientWidth || sunX<=0){directX=-directX;}if(sunY+sundiv.offsetHeight>=document.body.clientHeight || sunY<=0){directY=-directY;}}setInterval("sunMov()",10);//--></script></head><body style="background-image:URL('a.jpg');background-size:cover; background-repeat:no-repeat"><div id="sundiv" style="position:absolute"><img src="sun.png"/></div></body></html>


0 0
原创粉丝点击