幻灯片播放图片的效果想必大家都有见到过吧,下面有个不错的示例,感兴趣的朋友可以参考下
复制代码代码如下:
<select id="img_date" style="width: 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设置到相应的图片容器中。

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

}; 

js实现幻灯片播放图片示例代码的更多相关文章

  1. 简单的PHP上传图片和删除图片示例代码

    分享一例简单的PHP上传图片和删除图片示例代码,很简单,适合初学的朋友参考,用来研究php上传图片还是不错的. 1.php上传图片: <?php if (!empty($_FILES[" ...

  2. C#保存上传来的图片示例代码

    保存上传图片的方法有很多,在接下来的文章中为大家详细介绍下使用C#是如何做到的,感兴趣的朋友不要错过 复制代码代码如下: [HttpPost]  public string UploadImage() ...

  3. js替换字符串的所有示例代码

    js如何替换字符串中所有. /** * 替换字符串中所有 * @param obj 原字符串 * @param str1 替换规则 * @param str2 替换成什么 * @return 替换后的 ...

  4. js动态加载图片核心代码

    objMapHeart.src = obj.getAttribute("ItemImage"); //==============图片预加载处理================== ...

  5. asp.net后台cs中的JSON格式变量在前台Js中调用方法(前后台示例代码)

    //后台cs代码: using System; using System.Collections.Generic; using System.Linq; using System.Web; using ...

  6. phpcms v9用get-sql调用数据表中的图组图片示例代码

    {pc:get sql="SELECT pictureurls FROM phpcms_picture_data where id = $id" start="0&quo ...

  7. Camera图片特效处理综述(Bitmap的Pixels处理、Canvas/paint的drawBitmap处理、旋转图片、裁截图片、播放幻灯片浏览图片<线程固定时间显示一张>)

    一种是直接对Bitmap的像素进行操作,如:叠加.边框.怀旧.(高斯)模糊.锐化(拉普拉斯变换). Bitmap.getPixels(srcPixels, 0, width, 0, 0, width, ...

  8. 非常优秀的swiper插件————幻灯片播放、图片轮播

    http://www.idangero.us/ http://www.swiper.com.cn/ Swiper中文网 2015-10-15 SuperSlide2: (这是个PC用的滚屏插件,看着不 ...

  9. EasyNVR网页H5无插件播放摄像机视频功能二次开发之直播通道接口保活示例代码

    背景需求 随着雪亮工程.明厨亮灶.手机看店.智慧幼儿园监控等行业开始将传统的安防摄像头进行互联网.微信直播,我们知道摄像头直播的春天了.将安防摄像头或NVR上的视频流转成互联网直播常用的RTMP.HT ...

随机推荐

  1. dublin core实例

    <?xml version="1.0"?> <metadata xmlns="http://example.org/myapp/" xmlns ...

  2. 图像处理界的标准图像Lena背后的故事

    今天晚上实验室的哥们问到我:“蒋志强,你知道咱们数字图像处理界标准图像Lena吗?” “当然知道啊,不就是那个512×512的美丽姐姐的标准图像么?”我不以为然的回答: “那幅图像事实上不是原始图像? ...

  3. LINUX系统镜像下载总汇

    LINUX系统fedora.centos.debian.ubuntu ISO下载汇总 http://mirrors.sohu.com http://linux.ilvgo.cn/ ftp://gent ...

  4. ubuntu12.04的vim配置

    ubuntu12.04中使用的vim的版本不支持像语法高亮和文件类型检测等配置 #sudo apt-get install vim vim默认的配置使用起来还不能让人满意,还需要自己配置默认配置文件是 ...

  5. [Whole Web] [AngularJS] Localize your AngularJS Application with angular-localization

    It is best to start your application's localization efforts early in development, even if you only s ...

  6. VMWARE FUSION 6 KEY

    Serial number: VZ15K-DKD85-M85EP-W4P79-XAAU4 Serial number: VU50A-2UW9Q-M88UY-D7MQX-ZG8X8 Serial num ...

  7. centos 6.3安装mono和monoDevelop过程

    Mono官方网站:http://www.mono-project.com MonoDevelop官方网站:http://monodevelop.com/ 注:整个安装过程最好在同一个终端下完成! 1. ...

  8. Linux SSh scp使用【远程文件/目录的传输】

    一:Linux ssh scp的简介及作用: scp就是secure copy的简写,用于在linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进行拷贝不能跨服务器. 有时我们 ...

  9. 万网免费主机wordpress快速建站教程-万网主机申请

    很多小伙伴在万网的免费主机申请活动中建立起了自己的个人网站,但还是还有许多小伙伴现在想建站,却发现官网找不到免费主机的申请地址了,以为活动结束了?其实还是可以继续申请免费主机的,接下来小编给大家介绍如 ...

  10. (转)ASP.net的url重写

    1. 有关于URL的重写,本文也只是拿来主意.相继有MS的组件“URLRewriter”和在Global.asax里的“Application_BeginRequest()”编码方式,以及IIS里的I ...