JS实现的手机端精简幻灯片效果


Posted in Javascript onSeptember 05, 2016

本文实例讲述了JS实现的手机端精简幻灯片效果。分享给大家供大家参考,具体如下:

var curIndex = 0;
var timeInterval = 4000;
var arr = new Array();
arr[0] = "fukeb.jpg";
arr[1] = "baopi.jpg";
arr[2] = "renliub.jpg";
setInterval(changeImg, timeInterval);
function changeImg() {
  var obj = document.getElementById("showpic");
  if (curIndex == arr.length - 1) {
    curIndex = 0;
  } else {
    curIndex += 1;
  }
  obj.src = "/templets/v1/images/" + arr[curIndex];
}
document.writeln("<div style=\"width:300px;margin:10px auto 0 auto;overflow:hidden;\"><a href=\"/zixun/?f=top_ad\" target=\"_blank\"><img src=\"/templets/v1/images/fukeb.jpg\" id=\"showpic\" /></a></div>");

效果图:

JS实现的手机端精简幻灯片效果

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript中删除指定数组中指定的元素的代码
Feb 12 Javascript
10款新鲜出炉的 jQuery 插件(Ajax 插件,有幻灯片、图片画廊、菜单等)
Jun 08 Javascript
js获取光标位置和设置文本框光标位置示例代码
Jan 09 Javascript
Node.js 服务器端应用开发框架 -- Hapi.js
Jul 29 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
AngularJS extend用法详解及实例代码
Nov 15 Javascript
详解Node.js中exports和module.exports的区别
Apr 19 Javascript
laravel5.4+vue+element简单搭建的示例代码
Aug 29 Javascript
vue中slot(插槽)的介绍与使用
Nov 12 Javascript
微信小程序扫描二维码获取信息实例详解
May 07 Javascript
layer提示框添加多个按钮选择的实例
Sep 12 Javascript
Js视频播放器插件Video.js使用方法详解
Feb 04 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
Sep 05 #Javascript
Vuejs第九篇之组件作用域及props数据传递实例详解
Sep 05 #Javascript
AngularJS实现标签页的两种方式
Sep 05 #Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
Sep 05 #Javascript
详细谈谈AngularJS的子级作用域问题
Sep 05 #Javascript
Vuejs第七篇之Vuejs过渡动画案例全面解析
Sep 05 #Javascript
JS简单获取客户端IP地址的方法【调用搜狐接口】
Sep 05 #Javascript
You might like
php生成随机数的三种方法
2014/09/10 PHP
Mac系统下安装PHP Xdebug
2018/03/30 PHP
犀利的js 函数集合
2009/06/11 Javascript
js动画(animate)简单引擎代码示例
2012/12/04 Javascript
鼠标滚轴控制文本框值的JS代码
2013/11/19 Javascript
JavaScript实现鼠标滑过图片变换效果的方法
2015/04/16 Javascript
jQuery实现下滑菜单导航效果代码
2015/08/25 Javascript
JavaScript类型系统之Object详解
2016/01/07 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
2016/03/19 Javascript
jQuery validate+artdialog+jquery form实现弹出表单思路详解
2016/04/18 Javascript
jQuery添加和删除输入文本框标签代码
2016/05/20 Javascript
Jquery AJAX POST与GET之间的区别详细介绍
2016/10/17 Javascript
Javascript实现图片懒加载插件的方法
2016/10/20 Javascript
使用Promise链式调用解决多个异步回调的问题
2017/01/15 Javascript
Ionic项目中Native Camera的使用方法
2017/06/07 Javascript
JS中的回调函数实例浅析
2018/03/21 Javascript
使用vue2实现购物车和地址选配功能
2018/03/29 Javascript
vue实现添加与删除图书功能
2018/10/07 Javascript
详解ES6数组方法find()、findIndex()的总结
2020/05/12 Javascript
python中bisect模块用法实例
2014/09/25 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
python实现字符串和字典的转换
2018/09/29 Python
Python常见数据结构之栈与队列用法示例
2019/01/14 Python
钉钉群自定义机器人消息Python封装的实例
2019/02/20 Python
Django框架视图介绍与使用详解
2019/07/18 Python
python或C++读取指定文件夹下的所有图片
2019/08/31 Python
python误差棒图errorbar()函数实例解析
2020/02/11 Python
Python正则表达式如何匹配中文
2020/05/27 Python
纯CSS3代码实现文字描边
2016/04/25 HTML / CSS
html5中audio支持音频格式的解决方法
2018/08/24 HTML / CSS
adidas官方旗舰店:德国运动用品制造商
2017/11/25 全球购物
法学毕业生自我鉴定
2014/01/31 职场文书
遥感技术与仪器求职信
2014/02/22 职场文书
新闻编辑求职信
2014/07/13 职场文书
劳动者解除劳动合同通知书
2015/04/16 职场文书
转正申请报告格式
2015/05/15 职场文书