幻灯片播放图片的效果想必大家都有见到过吧,下面有个不错的示例,感兴趣的朋友可以参考下
复制代码代码如下:
<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. DoctorNote医生处方笔记开发记录

    1.开发背景 一个开诊所的中医朋友,希望我能给他开发一个记录病人姓名和处方的Android手机app,以便查询病人每次就诊信息,比如上一次的处方,以前他要找个病人上一次的就诊处方,几乎要翻遍一叠厚厚的 ...

  2. Ubuntu下开启root登陆

    亲手安装过Ubuntu的童鞋都知道,默认安装只会添加一个普通用户名和密码,而超级用户权限则是利用sudo命令来执行.在Ubuntu下使用root登陆或者在shell中用su命令切换到root时会提示错 ...

  3. Eclipse开发PHP环境配置

    首先准备好软件: 1. Apache,到这里找个最新版本 2. PHP,到这里下载 3. Eclipse IDE for Java EE Developers,到这里下载 4. DLTK Core F ...

  4. Palindrome(poj3974)(manacher算法)

    http://poj.org/problem?id=3974 Palindrome Time Limit: 15000MSMemory Limit: 65536K Total Submissions: ...

  5. Tinder 心动效果---卡片式view左右滑动

    http://www.eoeandroid.com/thread-549316-1-1.html SlideCard.zip

  6. sharepoint 2013 更改搜索server组态

    1.新搜索server在.安装sharepoint server 2013,并连接到一个现有的sharepoint server领域,完成后.您可以配置新的搜索server. 打开sharepoint ...

  7. yum在线升级

    RPM优点 由於 RPM 是透过预先编译并打包成为 RPM 文件格式后,再加以安装的一种方式,并且还能够进行数据库的记载. 所以 RPM 有以下的优点: RPM 内含已经编译过的程序与配置档等数据,可 ...

  8. (转+整理) oracle authid definer 与 authid current_user

    转:http://blog.csdn.net/indexman/article/details/17067531 http://blog.csdn.net/liqfyiyi/article/detai ...

  9. sql2012 新增 OFFSET/FETCH

    SQL Server 对行数的排序提供了 TOP 筛选.SQL Server 2012 新增了 OFFSET 筛选. 一.TOP 筛选 如果有 ORDER BY 子句,TOP 筛选将根据排序的结果返回 ...

  10. gulp自动化框架的搭建

    自动化框架的搭建:https://github.com/zjhsd2007/www 屏蔽掉的部分是Test(文件夹的目录 也是你的项目名称);本地项目启动后 配合sass,会自动启动浏览器,然后好处多 ...