首页写一个网页窗口广告进行移动的代码

写一个网页窗口广告进行移动的代码

时间: 2024-05-02 15:22:45 浏览: 8

好的，以下是一个简单的实现移动网页窗口广告的代码示例： ```html <!DOCTYPE html> <html> <head> <title>移动网页窗口广告</title> <style> #ad { position: fixed; bottom: 0; left: 0; width: 100%; height: 80px; background-color: #f0f0f0; text-align: center; line-height: 80px; font-size: 24px; } </style> </head> <body> <div id="ad">这是一个广告</div> <script> var ad = document.getElementById('ad'); var speed = 2; // 移动速度 setInterval(function() { var position = parseInt(ad.style.bottom); if (position >= window.innerHeight - 80) { // 到达窗口底部 speed = -2; // 反向移动 } else if (position <= 0) { // 到达窗口顶部 speed = 2; // 正向移动 } ad.style.bottom = (position + speed) + 'px'; // 设置下边距 }, 10); // 定时器间隔 </script> </body> </html> ``` 这段代码使用了 `position: fixed` 样式将广告固定在窗口底部，并通过设置 `bottom` 样式来移动它的位置，定时器循环改变其下边距实现上下移动效果。可以根据实际需求调整广告大小、移动速度等参数。希望能够对您有所帮助。