<div id="lunbo">

    <ul id="lunb">

        <li id="lunbo1"><img src="//static.runcodex.com/images/mix/img_fjords_wide.jpg"></li>

        <li id="lunbo2"><img src="//static.runcodex.com/images/mix/img_nature_wide.jpg"></li>

        <li id="lunbo3"><img src="//static.runcodex.com/images/mix/img_mountains_wide.jpg"></li>

        <li id="lunbo4"><img src="//static.runcodex.com/images/mix/paris.jpg"></li>

    </ul>

</div>

function addLoadEvent(func){

    var oldnload=window.onload;

    if(typeof window.onload !='function'){

       window.onload=func;

    } else {

        window.onload=function(){

            oldnload();

            func();

        }

      }

}

function positionmessage(){

    var elem=document.getElementById("lunbo1");

        elem.style.position="absolute";

        elem.style.left="0px";

        elem.style.top="0px";

        moveElement("lunbo1",-500,0,10)

}

function diaoyong(){

    var elem=document.getElementById("lunbo2");

        elem.style.position="absolute";

        elem.style.left="0px";

        elem.style.top="0px";

        moveElement("lunbo2",-500,0,10);

}

function diaoyong2(){

    var elem=document.getElementById("lunbo3");

        elem.style.position="absolute";

        elem.style.left="0px";

        elem.style.top="0px";

        moveElement("lunbo3",-500,0,10);

}

function diaoyong3(){

    var elem=document.getElementById("lunbo4");

        elem.style.position="absolute";

        elem.style.left="0px";

        elem.style.top="0px";

        moveElement("lunbo4",-500,0,10);

}

function moveElement(elementID,x,y,interval){

    if(!document.getElementById) return false;

    if(!document.getElementById(elementID)) return false;

    var elem=document.getElementById(elementID);

    var xpos =parseInt(elem.style.left);    /*parseInt提取字符串里的数值*/

    var ypos =parseInt(elem.style.top);

        if (xpos==x&&ypos==y){return true;}

        if (xpos<x){xpos++;}

        if (xpos>x){xpos--;}

        if (ypos<y){ypos++;}

        if (ypos>y){ypos--;}

    elem.style.left=xpos+"px";

    elem.style.top=ypos+"px";

    var repeat="moveElement('"+elementID+"',"+x+","+y+","+interval+")";

    movement=setTimeout(repeat,interval);   /*setTimeout 让函数经过预定时间开始执行*/

​

}

addLoadEvent(positionmessage);

    setTimeout("diaoyong()",7000);

    setTimeout("diaoyong2()",17000);

    setTimeout("diaoyong3()",24000);

body{margin:0;}

#lunbo{

    position:absolute;

   overflow:hidden;

    left:0px;

    top:80px;

    display:block;

    width:500px;

    height:330px;

}

#lunbo li {

    list-style-type:none;

}

​

#lunbo img{

    position:absolute;

    left:500px;

    width:500px;

    height:330px;

}