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 相关文章推荐
JavaScript 获得选中文本内容的方法
Feb 15 Javascript
一个简单的jquery的多选下拉框(自写)
May 05 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
Jun 24 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
微信小程序 POST请求(网络请求)详解及实例代码
Nov 16 Javascript
基于Vue的文字跑马灯组件(npm 组件包)
May 24 Javascript
Vue框架里使用Swiper的方法示例
Sep 20 Javascript
微信小程序整合使用富文本编辑器的方法详解
Apr 25 Javascript
vue仿ios列表左划删除
Sep 26 Javascript
js实现上下左右键盘控制div移动
Jan 16 Javascript
序列化模块json代码实例详解
Mar 03 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
一个图形显示IP的PHP程序代码
2007/10/19 PHP
详解PHP显示MySQL数据的三种方法
2008/06/05 PHP
PHP包含文件函数include、include_once、require、require_once区别总结
2014/04/05 PHP
PHP cURL获取微信公众号access_token的实例
2018/04/28 PHP
PHP关于foreach复制知识点总结
2019/01/28 PHP
PHP7 错误处理机制修改
2021/03/09 PHP
JavaScript 事件的一些重要说明
2009/10/25 Javascript
10个实用的脚本代码工具
2010/05/04 Javascript
鼠标移入移出事件改变图片的分辨率的两种方法
2013/12/17 Javascript
JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)
2014/10/17 Javascript
JavaScript如何自定义trim方法
2015/07/28 Javascript
jQuery地图map悬停显示省市代码分享
2015/08/20 Javascript
详解JavaScript for循环中发送AJAX请求问题
2020/06/23 Javascript
JavaScript实现时钟滴答声效果
2017/01/29 Javascript
Angular.JS去掉访问路径URL中的#号详解
2017/03/30 Javascript
脚手架vue-cli工程webpack的作用和特点
2018/09/29 Javascript
深入koa-bodyparser原理解析
2019/01/16 Javascript
vue回到顶部监听滚动事件详解
2019/08/02 Javascript
解决axios post 后端无法接收数据的问题
2019/10/29 Javascript
vue实现登录、注册、退出、跳转等功能
2020/12/23 Vue.js
[25:45]2018DOTA2亚洲邀请赛4.5SOLO赛 Sylar vs Paparazi
2018/04/06 DOTA
python实现数值积分的Simpson方法实例分析
2015/06/05 Python
Python入门教程之运算符与控制流
2016/08/17 Python
浅谈Python类的__getitem__和__setitem__特殊方法
2016/12/25 Python
Python实现判断一行代码是否为注释的方法
2018/05/23 Python
Tensorflow实现部分参数梯度更新操作
2020/01/23 Python
python判断两个序列的成员是否一样的实例代码
2020/03/01 Python
Python 字典一个键对应多个值的方法
2020/09/29 Python
canvas小画板之平滑曲线的实现
2020/08/12 HTML / CSS
美国隐形眼镜网上商店:Lens.com
2019/09/03 全球购物
软件测试有哪些?什么是配置项?
2012/02/12 面试题
国际商务专业学生个人的自我评价
2013/09/28 职场文书
《鸟的天堂》教学反思
2014/02/27 职场文书
瘦西湖导游词
2015/02/03 职场文书
南京南京观后感
2015/06/02 职场文书
详解SQL报错盲注
2022/07/23 SQL Server