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 相关文章推荐
使用TextRange获取输入框中光标的位置的代码
Mar 08 Javascript
标准的js无缝滚动效果
Aug 30 Javascript
jquery attr()设置和获取属性值实例教程
Sep 25 Javascript
vue-cli项目根据线上环境分别打出测试包和生产包
May 23 Javascript
jquery.onoff实现简单的开关按钮功能(推荐)
May 24 jQuery
react native 获取地理位置的方法示例
Aug 28 Javascript
如何自动化部署项目?折腾服务器之旅~
Apr 16 Javascript
vue项目前端错误收集之sentry教程详解
May 27 Javascript
详解vuex的简单todolist例子
Jul 14 Javascript
vue.js实现照片放大功能
Jun 23 Javascript
何时/使用 Vue3 render 函数的教程详解
Jul 25 Javascript
浅谈vue 二级路由嵌套和二级路由高亮问题
Aug 06 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
memcached 和 mysql 主从环境下php开发代码详解
2010/05/16 PHP
php根据用户语言跳转相应网页
2015/11/04 PHP
解决laravel session失效的问题
2019/10/14 PHP
js 表单验证方法(实用)
2009/04/28 Javascript
基于jquery的DIV随滚动条滚动而滚动的代码
2012/07/20 Javascript
js 获取坐标 通过JS得到当前焦点(鼠标)的坐标属性
2013/01/04 Javascript
JS this作用域以及GET传输值过长的问题解决方法
2013/08/06 Javascript
详解JavaScript基于面向对象之继承实例
2015/12/16 Javascript
微信小程序进行微信支付的步骤昂述
2016/12/01 Javascript
微信小程序 MD5的方法详解及实例代码
2017/03/10 Javascript
JavaScript canvas实现围绕旋转动画
2017/11/18 Javascript
AngularJS模态框模板ngDialog的使用详解
2018/05/11 Javascript
element el-input directive数字进行控制
2018/10/11 Javascript
vue2中引用及使用 better-scroll的方法详解
2018/11/15 Javascript
ES6模板字符串和标签模板的应用实例分析
2019/06/25 Javascript
微信公众号生成新浪短网址的实现(快速生成)
2019/08/18 Javascript
Node.js实现简单管理系统
2019/09/23 Javascript
整理 node-sass 安装失败的原因及解决办法(小结)
2020/02/19 Javascript
js通过canvas生成图片缩略图
2020/10/02 Javascript
Python使用剪切板的方法
2017/06/06 Python
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
Python面向对象总结及类与正则表达式详解
2019/04/18 Python
Python的numpy库下的几个小函数的用法(小结)
2019/07/12 Python
python中调试或排错的五种方法示例
2019/09/12 Python
windows中安装Python3.8.0的实现方法
2019/11/19 Python
Python生成器实现简单&quot;生产者消费者&quot;模型代码实例
2020/03/27 Python
Pycharm如何自动生成头文件注释
2020/11/14 Python
应聘护理专业毕业自荐书范文
2014/02/12 职场文书
小学教师师德承诺书
2014/05/23 职场文书
英语专业毕业生求职信
2014/05/24 职场文书
企业精神口号
2014/06/11 职场文书
五年级小学生评语
2014/12/26 职场文书
介绍信的写法
2015/01/31 职场文书
2015年毕业生个人自荐书
2015/03/24 职场文书
学校安全管理制度
2015/08/06 职场文书
珍惜时间的诗歌赏析
2019/08/23 职场文书