简单的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 相关文章推荐
Mootools 1.2教程 事件处理
Sep 15 Javascript
Ajax+Json 级联菜单实现代码
Oct 27 Javascript
jQuery javaScript捕获回车事件(示例代码)
Nov 07 Javascript
js获取通过ajax返回的map型的JSONArray的方法
Jan 09 Javascript
jQuery实现友好的轮播图片特效
Jan 12 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
Aug 25 Javascript
3种不同的ContextMenu右键菜单实现代码
Nov 03 Javascript
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
基于Vue开发数字输入框组件
Dec 19 Javascript
使用vue-infinite-scroll实现无限滚动效果
Jun 22 Javascript
JointJS JavaScript流程图绘制框架解析
Aug 15 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 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 设计模式之 工厂模式
2008/12/19 PHP
php 求质素(素数) 的实现代码
2011/04/12 PHP
php实现专业获取网站SEO信息类实例
2015/04/02 PHP
PHP yii实现model添加默认值的方法(两种方法)
2016/11/10 PHP
php制作基于xml的RSS订阅源功能示例
2017/02/08 PHP
php使用str_replace替换多维数组的实现方法分析
2017/06/15 PHP
js中将字符串转换成json的三种方式
2011/01/12 Javascript
javascript截取字符串(通过substring实现并支持中英文混合)
2013/06/24 Javascript
jQuery简易图片放大特效示例代码
2014/06/09 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
javascript实现PC网页里的拖拽效果
2016/03/14 Javascript
javascript正则表达式中分组详解
2016/07/17 Javascript
jquery配合.NET实现点击指定绑定数据并且能够一键下载
2016/10/28 Javascript
深入理解选择框脚本[推荐]
2016/12/13 Javascript
[js高手之路]原型式继承与寄生式继承详解
2017/08/28 Javascript
JS基于封装函数实现的表格分页完整示例
2018/06/26 Javascript
JavaScript解析及序列化JSON的方法实例分析
2019/01/04 Javascript
如何基于原生javaScript生成带图片的二维码
2019/11/21 Javascript
vue项目中使用bpmn-自定义platter的示例代码
2020/05/11 Javascript
微信小程序实现加入购物车滑动轨迹
2020/11/18 Javascript
在Python中利用Into包整洁地进行数据迁移的教程
2015/03/30 Python
Python实现把数字转换成中文
2015/06/29 Python
Python实现模拟时钟代码推荐
2015/11/08 Python
python如何实现远程控制电脑(结合微信)
2015/12/21 Python
Python3.6实现带有简单界面的有道翻译小程序
2019/04/16 Python
Python基于机器学习方法实现的电影推荐系统实例详解
2019/06/25 Python
python 用户交互输入input的4种用法详解
2019/09/24 Python
浅谈Html5多线程开发之WebWorkers
2018/05/02 HTML / CSS
苹果Mac升级:MacSales.com
2017/11/20 全球购物
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
Eclipse面试题
2014/03/22 面试题
市场推广策划方案
2014/06/02 职场文书
公路施工安全责任书
2015/05/08 职场文书
Nginx域名转发使用场景代码实例
2021/03/31 Servers
AI:如何训练机器学习的模型
2021/04/16 Python
JavaScript前端面试扁平数据转tree与tree数据扁平化
2022/06/14 Javascript