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 相关文章推荐
js动态控制table的tr、td增加及删除的具体实现
Apr 30 Javascript
基于jQuery的图片不完全按比例自动缩小
Jul 11 Javascript
js鼠标滑过图片震动特效的方法
Feb 17 Javascript
jQuery实现查找最近父节点的方法
Jun 23 Javascript
jquery实现的回旋滚动效果完整实例【附demo源码下载】
Sep 20 Javascript
javascript基本数据类型及类型检测常用方法小结
Dec 14 Javascript
深入探究angular2 UI组件之primeNG用法
Jul 26 Javascript
vue环境搭建简单教程
Nov 07 Javascript
vue打包使用Nginx代理解决跨域问题
Aug 27 Javascript
element UI upload组件上传附件格式限制方法
Sep 04 Javascript
vue+iview 兼容IE11浏览器的实现方法
Jan 07 Javascript
Vue Object.defineProperty及ProxyVue实现双向数据绑定
Sep 02 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 多个submit提交表单 处理方法
2009/07/07 PHP
Laravel框架中实现使用阿里云ACE缓存服务
2015/02/10 PHP
基于jquery的jqDnR拖拽溢出的修改
2011/02/12 Javascript
深入Javascript函数、递归与闭包(执行环境、变量对象与作用域链)使用详解
2013/05/08 Javascript
JavaScript中prototype为对象添加属性的误区介绍
2013/10/15 Javascript
javascript中的事件代理初探
2014/03/08 Javascript
JavaScript数组前面插入元素的方法
2015/04/06 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
2015/09/01 Javascript
利用jQuery和CSS将背景图片拉伸
2015/10/16 Javascript
基于Jquery和html5的7款个性化地图插件
2015/11/17 Javascript
javascript实现自动填写表单实例简析
2015/12/02 Javascript
Bootstrap按钮组件详解
2016/04/26 Javascript
bootstrap table 多选框分页保留示例代码
2017/03/08 Javascript
微信小程序 开发MAP(地图)实例详解
2017/06/27 Javascript
解决select2在bootstrap modal中不能正常使用的问题
2018/08/09 Javascript
[38:42]完美世界DOTA2联赛循环赛 Matador vs Forest BO2第二场 11.05
2020/11/05 DOTA
Python读写Redis数据库操作示例
2014/03/18 Python
Python的Flask框架中的Jinja2模板引擎学习教程
2016/06/30 Python
Python3爬虫使用Fidder实现APP爬取示例
2018/11/27 Python
Python实现字符型图片验证码识别完整过程详解
2019/05/10 Python
python使用百度文字识别功能方法详解
2019/07/23 Python
Python之time模块的时间戳,时间字符串格式化与转换方法(13位时间戳)
2019/08/12 Python
python实现递归查找某个路径下所有文件中的中文字符
2019/08/31 Python
python3多线程知识点总结
2019/09/26 Python
python常用排序算法的实现代码
2019/11/08 Python
Django admin禁用编辑链接和添加删除操作详解
2019/11/15 Python
python装饰器三种装饰模式的简单分析
2020/09/04 Python
小程序瀑布流解决左右两边高度差距过大的问题
2019/02/20 HTML / CSS
韩国三星旗下的一家超市连锁店:Home Plus
2016/07/30 全球购物
经典安踏广告词
2014/03/21 职场文书
促销活动计划书
2014/05/02 职场文书
感恩老师演讲稿600字
2014/08/28 职场文书
申报材料格式
2014/12/30 职场文书
MySQL触发器的使用
2021/05/24 MySQL
idea编译器vue缩进报错问题场景分析
2021/07/04 Vue.js
ubuntu端向日葵键盘输入卡顿问题及解决
2022/12/24 Servers