zoukankan      html  css  js  c++  java
  • js实现幻灯片播放图片示例代码

    幻灯片播放图片的效果想必大家都有见到过吧,下面有个不错的示例,感兴趣的朋友可以参考下
    复制代码代码如下:
    <select id="img_date" style=" 100%; margin-top: 10px; height: 50%;" size="20"> 
    <option value="图片的url">图片名字</option> 
    </select> 

    2,播放文件列表的方法。主要是遍历文件列表并把图片展示在相应的图片容器就可以显示出幻灯片的效果。 

    可以用延时的方法调用遍历方法:window.setInterval("PlayPics()", speed); 
    复制代码代码如下:

    /** 
    * 播放图片的处理方法 
    * site: www.jbxue.com
    * */ 
    function PlayPics() 

    var sel = document.getElementById("img_date"); 
    if(sel.length==0)//没有图片时直接返回 

    return; 

    else 

    if(sel.selectedIndex>0)//被选中的下标大于0时就设置上一图片项被选中。 

    sel.options[sel.selectedIndex-1].selected=true; 

    else{//如果是被选中项的下标是0,就设置最后一张图片为被选中。 
    sel.options[sel.length-1].selected=true; 

    ChangePic(sel.options[sel.selectedIndex].value);//获取选中的图片,并把图片的url设置到相应的图片容器中。 

    //这个方法可以根据自己的需要进行修改。 

    }; 
  • 相关阅读:
    Hadoop环境搭建2_hadoop安装和运行环境
    Hadoop环境搭建1_JDK+SSH
    Linux5_环境变量
    Linux4_文件操作
    Linux3_文件系统
    Linux2_小技巧
    Linux1_Ubuntu的安装
    PhoneGap移动开发框架
    iOS 使用GitHub托管代码(github desktop使用)
    MRC和ARC混编
  • 原文地址:https://www.cnblogs.com/linuxnotes/p/3413590.html
Copyright © 2011-2022 走看看