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 相关文章推荐
JavaScript Timer实现代码
Feb 17 Javascript
jquery的index方法实现tab效果
Feb 16 Javascript
基于jquery的blockui插件显示弹出层
Apr 14 Javascript
分享XmlHttpRequest调用Webservice的一点心得
Jul 20 Javascript
javascript常用代码段搜集
Dec 04 Javascript
详解JavaScript基于面向对象之继承
Dec 13 Javascript
Bootstrap栅格系统使用方法及页面调整变形的解决方法
Mar 10 Javascript
JS实现向iframe中表单传值的方法
Mar 24 Javascript
如何使用Bootstrap 按钮实例详解
Mar 29 Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
Apr 25 Javascript
Electron autoUpdater实现Windows安装包自动更新的方法
Dec 24 Javascript
Element输入框带历史查询记录的实现示例
Jan 15 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 读取输出其他文件的实现方法
2016/07/26 PHP
PhpStorm2020.1 安装 debug - Postman 调用的详细教程
2020/08/17 PHP
javascript FormatNumber函数实现方法
2008/12/30 Javascript
DWR Ext 加载数据
2009/03/22 Javascript
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
javascript 学习笔记(六)浏览器类型及版本信息检测代码
2011/04/08 Javascript
读jQuery之十一 添加事件核心方法
2011/07/31 Javascript
浅析js中2个等号与3个等号的区别
2013/08/06 Javascript
jQuery实现伸展与合拢panel的方法
2015/04/30 Javascript
AngularJS 实现JavaScript 动画效果详解
2016/09/08 Javascript
jQuery实现级联下拉框实战(5)
2017/02/08 Javascript
webpack热模块替换(HMR)/热更新的方法
2018/04/05 Javascript
vue 解决循环引用组件报错的问题
2018/09/06 Javascript
小程序实现左滑删除功能
2018/10/30 Javascript
vue项目首屏加载时间优化实战
2019/04/23 Javascript
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
2019/09/11 Javascript
[18:32]DOTA2 HEROS教学视频教你分分钟做大人-谜团
2014/06/12 DOTA
[01:19:54]DOTA2上海特级锦标赛主赛事日 - 2 败者组第二轮#1Alliance VS EHOME
2016/03/03 DOTA
python控制windows剪贴板,向剪贴板中写入图片的实例
2018/05/31 Python
Python Web编程之WSGI协议简介
2018/07/18 Python
linux安装Python3.4.2的操作方法
2018/09/28 Python
如何用Python破解wifi密码过程详解
2019/07/12 Python
python笔记_将循环内容在一行输出的方法
2019/08/08 Python
Python 定义只读属性的实现方式
2020/03/05 Python
中国第一家杂志折扣订阅网:杂志铺
2016/08/30 全球购物
英国现代家具和装饰网站:PN Home
2018/08/16 全球购物
星空联盟C# .net笔试题
2014/12/05 面试题
函授本科自我鉴定
2013/11/03 职场文书
单位活动策划方案
2014/08/17 职场文书
公司股份转让协议书范本
2015/01/28 职场文书
2015大学生暑假调查报告
2015/07/13 职场文书
学习十八大的感悟
2015/08/11 职场文书
2016教师党员学习心得体会
2016/01/21 职场文书
只需要这一行代码就能让python计算速度提高十倍
2021/05/24 Python
Nginx 路由转发和反向代理location配置实现
2021/11/11 Servers
python blinker 信号库
2022/05/04 Python