简单的js图片轮换代码(js图片轮播)


Posted in Javascript onMay 06, 2014
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 <title>images</title> 
 <script type="text/javascript"> 
  var curIndex = 0; 
  var timeInterval = 1000; 
  var arr = new Array(); 
  arr[0] = "1 (1).jpg"; 
  arr[1] = "1 (2).jpg"; 
  arr[2] = "1 (3).jpg"; 
  arr[3] = "1 (4).jpg"; 
  arr[4] = "1 (5).jpg"; 
  arr[5] = "1 (6).jpg"; 
  arr[6] = "1 (7).jpg"; 
  arr[7] = "1 (8).jpg";
  setInterval(changeImg,timeInterval); 
  function changeImg() { 
   var obj = document.getElementById("obj"); 
   if (curIndex == arr.length-1) { 
    curIndex = 0; 
   } else { 
    curIndex += 1; 
     } 
   obj.src = arr[curIndex]; 
  } 
 </script>  <script language="javascript"> 
  setInterval(test,1000); 
  var array = new Array(); 
  var index = 0; 
  var array = new Array("1 (1).jpg","1 (2).jpg","1 (3).jpg","1 (4).jpg","1 (5).jpg","1 (6).jpg","1 (7).jpg","1 (8).jpg"); 
  function test() { 
   var myimg=document.getElementById("imgs"); 
   if(index==array.length-1) 
   { index=0; }else{ index++; } 
   myimg.src=array[index]; 
  } 
 </script>
 </head> 
 <body> 
  <img id = "obj" src="1 (1).jpg" border = 0 /> 
 </body> 

<body>
</body>
</html>
Javascript 相关文章推荐
js关闭浏览器窗口及检查浏览器关闭事件
Sep 03 Javascript
JS实现拖动示例代码
Nov 01 Javascript
jQuery中ajax和post处理json的不同示例对比
Nov 02 Javascript
jQuery修改li下的样式以及li下的img的src的值的方法
Nov 02 Javascript
html的DOM中Event对象onblur事件用法实例
Jan 21 Javascript
javascript转换静态图片,增加粒子动画效果
May 28 Javascript
详解Bootstrap的aria-label和aria-labelledby应用
Jan 04 Javascript
javascript中不易分清的slice,splice和split三个函数
Mar 29 Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 Javascript
详解layui中的树形关于取值传值问题
Jan 16 Javascript
redux中间件之redux-thunk的具体使用
Apr 17 Javascript
Vue-input框checkbox强制刷新问题
Apr 18 Javascript
jQuery is()函数用法3例
May 06 #Javascript
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)
May 06 #Javascript
一些老手都不一定知道的JavaScript技巧
May 06 #Javascript
jQuery中的$.ajax()方法应用
May 06 #Javascript
jquery判断元素是否隐藏的多种方法
May 06 #Javascript
JQuery调用WebServices的方法和4个实例
May 06 #Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
May 05 #Javascript
You might like
PHP邮件专题
2006/10/09 PHP
PHP使用PHPMailer发送邮件的简单使用方法
2013/11/12 PHP
PHP empty函数报错解决办法
2014/03/06 PHP
PHP使用strrev翻转中文乱码问题的解决方法
2017/01/13 PHP
jQuery 图像裁剪插件Jcrop的简单使用
2009/05/22 Javascript
使用javascript过滤html的字符串(注释标记法)
2013/07/08 Javascript
Extjs中RowExpander控件的默认展开问题示例探讨
2014/01/24 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
2016/05/10 Javascript
jQuery on()方法绑定动态元素的点击事件实例代码浅析
2016/06/16 Javascript
jQuery实现弹幕效果
2017/02/17 Javascript
详解vue父子组件关于模态框状态的绑定方案
2019/06/05 Javascript
python实现巡检系统(solaris)示例
2014/04/02 Python
python使用super()出现错误解决办法
2017/08/14 Python
python3.4.3下逐行读入txt文本并去重的方法
2018/04/29 Python
python爬取网页内容转换为PDF文件
2020/07/28 Python
python3使用SMTP发送简单文本邮件
2018/06/19 Python
python 实现将文件或文件夹用相对路径打包为 tar.gz 文件的方法
2019/06/10 Python
Python读取xlsx文件的实现方法
2019/07/04 Python
django 配置阿里云OSS存储media文件的例子
2019/08/20 Python
css3 按钮 利用css3实现超酷下载按钮
2013/03/18 HTML / CSS
纯css3制作的火影忍者写轮眼开眼至轮回眼及进化过程实例
2014/11/11 HTML / CSS
荷兰皇家航空公司官方网站:KLM Royal Dutch Airlines
2017/12/07 全球购物
加州风格的游泳和沙滩装品牌:Cupshe
2019/06/10 全球购物
屈臣氏俄罗斯在线商店:Watsons俄罗斯
2020/08/03 全球购物
用你熟悉的语言写一个连接ORACLE数据库的程序,能够完成修改和查询工作
2012/06/11 面试题
个人自我剖析材料
2014/02/07 职场文书
基督教婚礼主持词
2014/03/14 职场文书
销售内勤岗位职责
2014/04/15 职场文书
校园环保广播稿(3篇)
2014/09/15 职场文书
2014年终工作总结范本
2014/12/15 职场文书
手把手教你用SpringBoot将文件打包成zip存放或导出
2021/06/11 Java/Android
关于python中readlines函数的参数hint的相关知识总结
2021/06/24 Python
CSS3 Tab动画实例之背景切换动态效果
2021/08/23 HTML / CSS
Python 如何利用ffmpeg 处理视频素材
2021/11/27 Python
nginx设置资源请求目录的方式详解
2022/05/30 Servers