zoukankan      html  css  js  c++  java
  • 图片自动播放

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="UTF-8">
    <title>图片自动播放</title>
    <style>
    #pic{120px;height:50px;border:1px solid #ccc;margin:50px auto;}
    </style>
    <script src="jquery-1.9.1.js"></script>
    <script>
    $(function(){
    var imgArr=[1,2,3];//创建一个数组,数组的length就是图片的总数
    var i=1; //默认为第一张
    setInterval(function(){//开启定时器
    i++; //局部累加
    if(i>imgArr.length){
    i=1; //如果到最后一张了,就让它从头开始
    }
    var imgSrc="img/banner"+i+".png"; //设置图片路径
    var obj=$("<img alt='banner"+i+"'>").attr("src",imgSrc);//创建img,并动态设置路径
    $("#pic").html(obj); //将img插入div中(用html()追加,原来的就会被后面的覆盖,如果用append()追加,就要.empty()先清空再追加)
    },1500);

    });
    </script>
    </head>
    <body>
    <div id="pic">
    </div>
    </body>
    </html>

  • 相关阅读:
    软件工程实践总结
    用户使用调查报告
    Beta 冲刺 随笔合集
    Beta 冲刺 七
    Beta 冲刺 六
    Beta 冲刺 五
    Beta 冲刺 四
    Beta 冲刺 三
    Beta 冲刺 二
    Beta 冲刺 一
  • 原文地址:https://www.cnblogs.com/annie211/p/6000016.html
Copyright © 2011-2022 走看看