JS实现的简单图片切换功能示例【测试可用】


Posted in Javascript onFebruary 14, 2017

本文实例讲述了JS实现的简单图片切换功能。分享给大家供大家参考,具体如下:

<!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>图片切换</title>
</head>
<body><script language="JavaScript1.1">
<!--
var slidespeed=2000
var slideimages=new Array("images/1.jpg","images/2.jpg","images/3.jpg","images/4.jpg")
var imageholder=new Array()
var ie55=window.createPopup
for (i=0;i<slideimages.length;i++){
imageholder[i]=new Image()
imageholder[i].src=slideimages[i]
}
function gotoshow(){
window.location=slidelinks[whichlink]
}
//-->
</script>
<img src="images/1.jpg" name="slide" border=0 style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=15,Duration=1)">
<script language="JavaScript1.1">
<!--
var whichlink=0
var whichimage=0
var pixeldelay=(ie55)? document.images.slide.filters[0].duration*1000 : 0
function slideit(){
if (!document.images) return
if (ie55) document.images.slide.filters[0].apply()
document.images.slide.src=imageholder[whichimage].src
if (ie55) document.images.slide.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setTimeout("slideit()",slidespeed+pixeldelay)
}
slideit()
//-->
</script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
使用JQuery和s3captche实现一个水果名字的验证
Aug 14 Javascript
jQuery 入门级学习笔记及源码
Jan 22 Javascript
JavaScript高级程序设计 阅读笔记(二十一) JavaScript中的XML
Sep 14 Javascript
如何使用Javascript正则表达式来格式化XML内容
Jul 04 Javascript
jquery中$.post()方法的简单实例
Feb 04 Javascript
javascript中实现兼容JAVA的hashCode算法代码分享
Aug 11 Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
Sep 19 Javascript
jQuery过滤选择器经典应用
Aug 18 Javascript
jQuery实现联动下拉列表查询框
Jan 04 Javascript
node.js发送邮件email的方法详解
Jan 06 Javascript
javascript 玩转Date对象(实例讲解)
Jul 11 Javascript
Javascript下拉刷新的简单实现
Feb 14 #Javascript
Vue 短信验证码组件开发详解
Feb 14 #Javascript
JS去除字符串中空格的方法
Feb 14 #Javascript
Node.js与Sails redis组件的使用教程
Feb 14 #Javascript
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】
Feb 14 #Javascript
canvas实现十二星座星空图
Feb 14 #Javascript
JavaScript省市级联下拉菜单实例
Feb 14 #Javascript
You might like
PHP根据传入参数合并多个JS和CSS文件的简单实现
2014/06/13 PHP
详解PHP归并排序的实现
2016/10/18 PHP
php实现URL加密解密的方法
2016/11/17 PHP
PHP实现截取中文字符串不出现?号的解决方法
2016/12/29 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
2009/11/26 Javascript
Web开发者必备的12款超赞jQuery插件
2010/12/03 Javascript
JS根据变量保存方法名并执行方法示例
2014/04/04 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
jQuery图片左右滚动代码 有左右按钮实例
2016/06/20 Javascript
ASP.NET jquery ajax传递参数的实例
2016/11/02 Javascript
Angular.Js的自动化测试详解
2016/12/09 Javascript
javascript 的变量、作用域和内存问题
2017/04/19 Javascript
Vue中父组件向子组件通信的方法
2017/07/11 Javascript
JavaScript中引用vs复制示例详析
2018/12/06 Javascript
亲自动手实现vue日历控件
2019/06/26 Javascript
vue回到顶部监听滚动事件详解
2019/08/02 Javascript
JS校验与最终登陆界面功能完整示例
2020/01/13 Javascript
JS实现前端路由功能示例【原生路由】
2020/05/29 Javascript
vue 弹出遮罩层样式实例
2020/07/22 Javascript
PYTHON正则表达式 re模块使用说明
2011/05/19 Python
python 垃圾收集机制的实例详解
2017/08/20 Python
python实现从文件中读取数据并绘制成 x y 轴图形的方法
2018/10/14 Python
在Python中调用Ping命令,批量IP的方法
2019/01/26 Python
使用keras实现Precise, Recall, F1-socre方式
2020/06/15 Python
python如何设置静态变量
2020/09/07 Python
纯CSS3编写的的精美动画进度条(无flash/无图像/无脚本/附源码)
2013/01/07 HTML / CSS
诺心蛋糕官网:LE CAKE
2018/08/25 全球购物
莫斯科制造商的廉价皮大衣:Fursk
2020/06/09 全球购物
Oracle性能调优原则
2012/05/03 面试题
招聘与培训专员岗位职责
2014/01/30 职场文书
关于环保的建议书400字
2014/03/12 职场文书
演讲稿祖国在我心中
2014/05/04 职场文书
常务副总经理岗位职责
2015/02/02 职场文书
整改通知书格式
2015/04/22 职场文书
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript