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 相关文章推荐
学习ExtJS TextField常用方法
Oct 07 Javascript
让你的网站可编辑的实现js代码
Oct 19 Javascript
javascript面向对象的方式实现的弹出层效果代码
Jan 28 Javascript
自己用jQuery写了一个图片的马赛克消失效果
May 04 Javascript
JS交换变量的方法
Jan 21 Javascript
JavaScript采用递归算法计算阶乘实例
Aug 04 Javascript
JavaScript中实现Map的示例代码
Sep 09 Javascript
js 右侧浮动层效果实现代码(跟随滚动)
Nov 22 Javascript
jQuery菜单实例(全选,反选,取消)
Aug 28 jQuery
vue组件tabbar使用方法详解
Nov 06 Javascript
Vue js 的生命周期(看了就懂)(推荐)
Mar 29 Javascript
React中使用外部样式的3种方式(小结)
May 28 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
WINDOWS 2000下使用ISAPI方式安装PHP
2006/09/05 PHP
dede3.1分页文字采集过滤规则详说(图文教程)续四
2007/04/03 PHP
php模板中出现空行解决方法
2011/03/08 PHP
php 验证码(倾斜,正弦干扰线,黏贴,旋转)
2013/06/29 PHP
Netbeans 8.2与PHP相关的新特性介绍
2016/10/08 PHP
JSONP 跨域共享信息
2012/08/16 Javascript
Jquery 获取对象的几种方式介绍
2014/01/17 Javascript
Jquery基础教程之DOM操作
2015/08/19 Javascript
编写高质量JavaScript代码的基本要点
2016/03/02 Javascript
在JS中a标签加入单击事件屏蔽href跳转页面
2016/12/16 Javascript
Jquery-data的三种用法
2017/04/18 jQuery
Django中使用jquery的ajax进行数据交互的实例代码
2017/10/15 jQuery
Vue+axios实现统一接口管理的方法
2018/07/23 Javascript
从组件封装看Vue的作用域插槽的实现
2019/02/12 Javascript
layui的面包屑或者表单不显示的解决方法
2019/09/05 Javascript
vue实现拖拽效果
2019/12/23 Javascript
[42:20]Secret vs Liquid 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python中logging模块的用法实例
2014/09/29 Python
纯Python开发的nosql数据库CodernityDB介绍和使用实例
2014/10/23 Python
python简单线程和协程学习心得(分享)
2017/06/14 Python
Python数据结构之哈夫曼树定义与使用方法示例
2018/04/22 Python
基于Django统计博客文章阅读量
2019/10/29 Python
使用Python的networkx绘制精美网络图教程
2019/11/21 Python
基于python tkinter的点名小程序功能的实例代码
2020/08/22 Python
详解python os.path.exists判断文件或文件夹是否存在
2020/11/16 Python
Python制作简单的剪刀石头布游戏
2020/12/10 Python
利用HTML5中Geolocation获取地理位置调用Google Map API在Google Map上定位
2013/01/23 HTML / CSS
德国EGOIST网店:销售畅销的设计师品牌
2017/04/18 全球购物
日本航空官方网站:JAL
2019/06/19 全球购物
美国沙龙美发产品购物网站:Hair.com by L’Oreal
2020/11/09 全球购物
应用化学专业本科生求职信
2013/09/29 职场文书
酒店秘书求职信范文
2014/02/17 职场文书
旅行社各个岗位职责
2014/03/15 职场文书
爱心捐款倡议书
2014/04/14 职场文书
工程部文员岗位职责
2015/02/04 职场文书
蜗居观后感
2015/06/11 职场文书