广告图片运动

假定图片区域的id为your_id，代码分为两部分：
第一部分是HTML代码，用于显示广告图片链接；
第二部分是JS代码，用于控制广告图片运动。



广告图片的HTML代码

Html代码 
<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='http://124.232.156.170/nxsyzx/zhaosheng/baoming.gif' width='108' height='108' border='0'/> 
    </a> 
</div> 


用于控制图片运动的JS代码

Js代码 
(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系统中。