超好用的网页浮动广告代码（可在线体味）

超好用的网页浮动广告代码（可在线体验）
超好用的网页浮动广告代码（可在线体验）

假定图片区域的id为your_id，代码分为两部分：

第一部分是HTML代码，用于显示广告图片链接；

第二部分是JS代码，用于控制广告图片运动。

?

?

?

<div id='your_id' style='z-index: 100; left: 2px; width: 108px; position: absolute; top: 43px; height: 108px; visibility: visible;'>    <a href='http://codingstandards.iteye.com/' target='_blank'>        <img src='/uploadfile/jiaocheng/2014/0126/2014012621132825598.gif' width='108' height='108' border='0'/>    </a></div>

?

?

(function(id){var xPos = 2;var yPos = 43; var step = 1;var delay = 30; var height = 0;var Hoffset = 0;var Woffset = 0;var yon = 0;var xon = 0;var pause = true;var interval;var img1 = document.getElementById(id);img1.style.top = yPos;function changePos() {width = document.body.clientWidth;height = document.body.clientHeight;Hoffset = img1.offsetHeight;Woffset = img1.offsetWidth;img1.style.left = xPos + document.body.scrollLeft;img1.style.top = yPos + document.body.scrollTop;if (yon) {yPos = yPos + step;}else {yPos = yPos - step;}if (yPos < 0) {yon = 1;yPos = 0;}if (yPos >= (height - Hoffset)) {yon = 0;yPos = (height - Hoffset);}if (xon) {xPos = xPos + step;}else {xPos = xPos - step;}if (xPos < 0) {xon = 1;xPos = 0;}if (xPos >= (width - Woffset)) {xon = 0;xPos = (width - Woffset);   }}function start() { img1.visibility = 'visible';interval = setInterval(changePos, delay);}function pause_resume() {if(pause) {clearInterval(interval);pause = false;} else {interval = setInterval(changePos,delay);pause = true; }}start();})('your_id');

?

PS：本文中的代码参考了网络上常用的浮动广告代码，但做了一些修改，更加实用。它限制了变量的作用域，能够直接嵌入到某些门户CMS系统中。

?

?

点我体验一下浮动广告效果哦

?

?

?