js 实现定时显示图片

如下图所示每隔十秒依次 把图片播放出来

解决方案 »

  1.   

    setTimeout和setInterval的语法相同。它们都有两个参数，一个是将要执行的代码字符串，还有一个是以毫秒为单位的时间间隔，当过了那个时间段之后就将执行那段代码。不过这两个函数还是有区别的，setInterval在执行完一次代码之后，经过了那个固定的时间间隔，它还会自动重复执行代码，而setTimeout只执行一次那段代码。
      

  2.   

    setInterval("",1000)
    function change(){
     document.images[0].src="";
    }
      

  3.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Language" content="zh-cn" /> <title>图片自动更新</title>
    <style type="text/css">
    *{
    margin: 0;
    padding: 0;
    } #main{
    margin: 50px 0 0 50px;
    width: 198px;
    height: 198px;
    border: 1px solid #000000;
    overflow: hidden;
    } #image{
    position: relative;
    } #image1,#image2,#image3{
    width: 198px;
    height: 198px;
    background-color: red;
    } #image2{
    background-color: pink;
    }
    </style> <script type="text/javascript">
    var i=0;
    function showimage(){
    document.getElementById("image").style.top=i+"px";
    if(i>=-198){
    i--;
    t=setTimeout("showimage()",30);
    }
    }
    </script>
    </head> <body>
    <div id="main">
    <div id="image">
    <p id="image1">image 1</p>
    <p id="image2">image 2</p>
    <p id="image3">image 3</p>
    </div>
    </div>
    <input type="submit" value="滚动图片" onclick="showimage();"/></body>
    </html>
    试试我的这个代码