js图片模糊切换显示特效的方法


Posted in Javascript onFebruary 17, 2015

本文实例讲述了js图片模糊切换显示特效的方法。分享给大家供大家参考。具体实现方法如下:

<html>

<title>一款图片模糊切换显示效果</title>

<body>

<script language="JavaScript1.1">

<!--

var slidespeed=3000

var slideimages=new Array("/images/m01.jpg","/images/m02.jpg","/images/m03.jpg","/images/m04.jpg")

var slidelinks=new Array("https://3water.com","https://3water.com","https://3water.com")

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>

<a href="javascript:gotoshow()"><img src="/images/csrcode.ico" name="slide" border=0 style="filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=15,Duration=1)" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>

<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设置IFRAME的SRC值的代码
Nov 30 Javascript
Js 正则表达式知识汇总
Dec 02 Javascript
jQuery解析json数据实例分析
Nov 24 Javascript
jQuery获取单击节点对象的方法
Jun 02 Javascript
Base64(二进制)图片编码解析及在各种浏览器的兼容性处理
Feb 09 Javascript
Javascript中引用类型传递的知识点小结
Mar 06 Javascript
微信小程序使用wxParse解析html的方法教程
Jul 06 Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
Oct 10 Javascript
微信小程序实现form表单本地储存数据
Jun 27 Javascript
微信小程序 网络通信实现详解
Jul 23 Javascript
详解使用WebPack搭建React开发环境
Aug 06 Javascript
微信小程序 动态修改页面数据及参数传递过程详解
Sep 27 Javascript
js实现单击图片放大图片的方法
Feb 17 #Javascript
js实现iframe自动自适应高度的方法
Feb 17 #Javascript
js全选实现和判断是否有复选框选中的方法
Feb 17 #Javascript
Jquery树插件zTree用法入门教程
Feb 17 #Javascript
js实现九宫格图片半透明渐显特效的方法
Feb 16 #Javascript
JS+CSS实现Li列表隔行换色效果的方法
Feb 16 #Javascript
JavaScript实现文字与图片拖拽效果的方法
Feb 16 #Javascript
You might like
解析php 版获取重定向后的地址(代码)
2013/06/26 PHP
php中生成随机密码的自定义函数代码
2013/10/21 PHP
php实现的DateDiff和DateAdd时间函数代码分享
2014/08/16 PHP
php从给定url获取文件扩展名的方法
2015/03/14 PHP
PHP版微信第三方实现一键登录及获取用户信息的方法
2016/10/14 PHP
javascript实现划词标记+划词搜索功能
2007/03/06 Javascript
Jquery 基础学习笔记之文档处理
2009/05/29 Javascript
基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
2010/06/10 Javascript
js获取IP和PcName(IE)在vs中可用
2013/08/02 Javascript
JSON格式的键盘编码对照表
2015/01/29 Javascript
浅谈layer的iframe弹窗给里面的标签赋值的问题
2016/11/10 Javascript
微信小程序-消息提示框实例
2016/11/24 Javascript
微信小程序 下拉列表的实现实例代码
2017/03/08 Javascript
Vuex之理解Getters的用法实例
2017/04/19 Javascript
Centos6.8下Node.js安装教程
2017/05/12 Javascript
深入理解JavaScript创建对象的多种方式以及优缺点
2017/06/01 Javascript
vue.js评论发布信息可插入QQ表情功能
2017/08/08 Javascript
针对Vue路由history模式下Nginx后台配置操作
2020/10/22 Javascript
python修改注册表终止360进程实例
2014/10/13 Python
python2.7+selenium2实现淘宝滑块自动认证功能
2018/02/24 Python
Python代码缩进和测试模块示例详解
2018/05/07 Python
django如何连接已存在数据的数据库
2018/08/14 Python
python re库的正则表达式入门学习教程
2019/03/08 Python
Django如何开发简单的查询接口详解
2019/05/17 Python
pytorch 使用单个GPU与多个GPU进行训练与测试的方法
2019/08/19 Python
Python实现图像的垂直投影示例
2020/01/17 Python
10 套华丽的CSS3 按钮小结
2012/10/03 HTML / CSS
AmazeUI 评论列表的实现示例
2020/08/13 HTML / CSS
德国净水壶和滤芯品牌:波尔德PearlCo(家用净水器)
2020/04/29 全球购物
Linux Interview Questions For software testers
2012/06/02 面试题
个人综合鉴定材料
2014/05/23 职场文书
群众路线教育实践活动对照检查材料思想汇报(副处级领导)
2014/10/04 职场文书
幼儿园大班教育随笔
2015/08/14 职场文书
Python实现socket库网络通信套接字
2021/06/04 Python
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
win11开机发生死循环重启怎么办?win11开机发生死循环重启解决方法
2022/08/05 数码科技