首页<html> <head> <title> New Document </title> <meta NAME="Generator" CONTENT="EditPlus"> <meta NAME="Author" CONTENT=""> <meta NAME="Keywords" CONTENT=""> <meta NAME="Description" CONTENT=""> <script> var x=50,y=60//浮动广告的初始位置 var xin =true,yin=true; //xin为真则向右运动，否则向左运动， //yin为真则向下运动，否则向上运动 var step=1;//移动的距离 var delay=10;//移动的时间间隔 function floatAD(){ var L=T=0;//L为左边界T为上边界 var R=document.body.offsetWidth-document.getElementById("fly").offsetWidth; //层移动到右边界 var B=document.body.offsetHeight-document.getElementById("fly").offsetHeight; //层移动到下边界 document.getElementById("fly").style.left=x;//层移动后的左边界 document.getElementById("fly").style.top=y;//层移动后的上边界 x=x+step*(xin?1:-1);//判断水平方向 if(x<L){ xin=true;x=L }//层到达边界后的处理 if(x>R){ xin=false;x=R } y=y+step*(yin?1:-1); if(y<T){ yin=true;y=T } if(y>B){ yin=false;y=B } setTimeout("floatAD()",delay) } </script> </head> <body onload="floatAD()"> <div id="fly" style="position:absolute;left:16px;top:80px;width:265px;height:135px;z-index:1;"> <a href="#"><img src="小丑.jpg" width="264" height="134" border="0"></a> </div> </body> </html>

<html> <head> <title> New Document </title> <meta NAME="Generator" CONTENT="EditPlus"> <meta NAME="Author" CONTENT=""> <meta NAME="Keywords" CONTENT=""> <meta NAME="Description" CONTENT=""> <script> var x=50,y=60//浮动广告的初始位置 var xin =true,yin=true; //xin为真则向右运动，否则向左运动， //yin为真则向下运动，否则向上运动 var step=1;//移动的距离 var delay=10;//移动的时间间隔 function floatAD(){ var L=T=0;//L为左边界T为上边界 var R=document.body.offsetWidth-document.getElementById("fly").offsetWidth; //层移动到右边界 var B=document.body.offsetHeight-document.getElementById("fly").offsetHeight; //层移动到下边界 document.getElementById("fly").style.left=x;//层移动后的左边界 document.getElementById("fly").style.top=y;//层移动后的上边界 x=x+step(xin?1:-1);//判断水平方向 if(x<L){ xin=true;x=L }//层到达边界后的处理 if(x>R){ xin=false;x=R } y=y+step(yin?1:-1); if(y<T){ yin=true;y=T } if(y>B){ yin=false;y=B } setTimeout("floatAD()",delay) } </script> </head> <body onload="floatAD()"> <div id="fly" style="position:absolute;left:16px;top:80px;width:265px;height:135px;z-index:1;"> <a href="#"><img src="小丑.jpg" width="264" height="134" border="0"></a> </div> </body> </html>

时间: 2023-12-19 13:05:17 浏览: 141

这是一个使用 JavaScript 实现的浮动广告。代码中定义了浮动广告的初始位置、移动的方向和距离，然后在页面加载完成后调用 floatAD() 函数来实现浮动广告的动画效果。具体来说，floatAD() 函数会根据当前位置和移动方向计算出下一步的位置，并根据边界限制来判断是否需要改变移动方向。最后，通过 setTimeout() 方法来设置定时器，实现广告的连续移动效果。

阅读全文