js实现有时间限制消失的图片方法


Posted in Javascript onFebruary 27, 2015

本文实例讲述了js实现有时间限制消失的图片方法。分享给大家供大家参考。具体实现方法如下:

<html>

<title>指定时间内消失的图片</title>

<body>

<SCRIPT language=JavaScript>

<!-- Hide the script from old browsers --

// 1) 做一个88*31的LOGO。

if (document.images)

var staticlogo=new Image(758,100)

// 2) 设置LOGO的路径。

staticlogo.src="/images/banner.gif"

// 3) 以下是LOGO代表的连接。

var logolink="http://ww3water.com/"

// 4) 设置ALT属性。

var alttext="代码家园"

// 5) 设置下列属性为 1或者0(1是IE特有的,使LOGO隐现)

var fadeintoview=1

/* 6) 最后设置LOGO显示的时间,例如12 秒,数值为0表示一直显示

*/

var visibleduration=5

function regenerate(){

window.location.reload()

}

function regenerate2(){

if (document.layers)

setTimeout("window.onresize=regenerate",400)

}

var fadeset=''

if (fadeintoview)

fadeset="filter:alpha(opacity=0)"

if (document.all)

document.write('<span id="logo"" style="'+fadeset+';position:absolute;top:100;width:'+staticlogo.width+';height:'+staticlogo.height+'"></span>')

function bringintoview(){

if (logo.filters.alpha.opacity<=95)

logo.filters.alpha.opacity+=5

else{

clearInterval(viewit)

if (visibleduration!=0)

setTimeout("logo.style.visibility='hidden'",visibleduration*1000)

}

}

function createlogo(){

staticimage=new Layer(100)

staticimage.left=-300

staticimage.top=120

staticimage.document.write('<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>')

staticimage.document.close()

staticimage.visibility="show"

regenerate2()

staticitns()

}

if (document.layers)

window.onload=createlogo;

if (document.all){

w=2

h=2

logo.style.left=w

logo.style.top=h

}

function logoit(){

var w2=document.body.scrollLeft+w

var h2=document.body.scrollTop+h

logo.style.left=w2

logo.style.top=h2

}

function logoit2(){

staticimage.left=pageXOffset+2

staticimage.top=pageYOffset+2

}

function insertimage(){

logo.innerHTML='<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>'

if (fadeintoview)

viewit=setInterval("bringintoview()",100)

else{

if (visibleduration!=0)

setTimeout("logo.style.visibility='hidden'",visibleduration*1000)

}

}

if (document.all){

window.onscroll=logoit

window.onresize=new Function("window.location.reload()")

window.onload=insertimage

}

function staticitns(){

setInterval("logoit2()",90)

if (visibleduration!=0)

setTimeout("staticimage.visibility='hide'",visibleduration*1000)

}

//--> 

</SCRIPT>

</body>

</html>

<br>

<br>

<br>

<br>

<br>

<br>图片5秒之后自动消失。

<br>

<br>

<br>

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

Javascript 相关文章推荐
建立良好体验度的Web注册系统ajax
Jul 09 Javascript
jqPlot jquery的页面图表绘制工具
Jul 25 Javascript
微信小程序 实现动态显示和隐藏某个控件
Apr 27 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
Jun 01 Javascript
利用10行js代码实现上下滚动公告效果
Dec 08 Javascript
bmob js-sdk 在vue中的使用教程
Jan 21 Javascript
vue组件实现弹出框点击显示隐藏效果
Oct 26 Javascript
详解基于Node.js的HTTP/2 Server实践
May 31 Javascript
vue指令只能输入正数并且只能输入一个小数点的方法
Jun 08 Javascript
js实现动态增加文件域表单功能
Oct 22 Javascript
element中table高度自适应的实现
Oct 21 Javascript
vue下拉刷新组件的开发及slot的使用详解
Dec 23 Vue.js
js用拖动滑块来控制图片大小的方法
Feb 27 #Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 #Javascript
对比分析AngularJS中的$http.post与jQuery.post的区别
Feb 27 #Javascript
JavaScript中Function详解
Feb 27 #Javascript
JS实现图片产生波纹一样flash效果的方法
Feb 27 #Javascript
js实现鼠标触发图片抖动效果的方法
Feb 27 #Javascript
javascript实现当前页导航激活的方法
Feb 27 #Javascript
You might like
咖啡界又出新概念,无需咖啡豆的分子咖啡
2021/03/03 咖啡文化
php设计模式之单例、多例设计模式的应用分析
2013/06/30 PHP
PHP微信开发用Cache 解决数据缓存
2016/07/11 PHP
Yii框架布局文件的动态切换操作示例
2019/11/11 PHP
深入理解JavaScript定时机制
2010/10/29 Javascript
js闭包引起的事件注册问题介绍
2016/03/29 Javascript
浅谈时钟的生成(js手写简洁代码)
2016/08/20 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
2017/03/09 Javascript
分享vue.js devtools遇到一系列问题
2017/10/24 Javascript
JavaScript中EventLoop介绍
2018/01/22 Javascript
jQuery.validate.js表单验证插件的使用代码详解
2018/10/22 jQuery
js中对象和面向对象与Json介绍
2019/01/21 Javascript
详解javascript中的Error对象
2019/04/25 Javascript
vue+elementUI动态生成面包屑导航教程
2019/11/04 Javascript
vscode 使用Prettier插件格式化配置使用代码详解
2020/08/10 Javascript
React 条件渲染最佳实践小结(7种)
2020/09/27 Javascript
浅谈Python浅拷贝、深拷贝及引用机制
2016/12/15 Python
Python的爬虫框架scrapy用21行代码写一个爬虫
2017/04/24 Python
Python3网络爬虫之使用User Agent和代理IP隐藏身份
2017/11/23 Python
Python实例方法、类方法、静态方法的区别与作用详解
2019/03/25 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
基于python计算并显示日间、星期客流高峰
2020/05/07 Python
使用python-Jenkins批量创建及修改jobs操作
2020/05/12 Python
Python pandas如何向excel添加数据
2020/05/22 Python
如何用Matplotlib 画三维图的示例代码
2020/07/28 Python
python boto和boto3操作bucket的示例
2020/10/30 Python
python里反向传播算法详解
2020/11/22 Python
HTML5 input placeholder 颜色修改示例
2014/05/30 HTML / CSS
美国波西米亚风格服装品牌:Show Me Your Mumu
2018/01/05 全球购物
经理管理专业毕业自荐书范文
2014/02/12 职场文书
篮球比赛口号
2014/06/10 职场文书
大学生国家助学金感谢信
2015/01/23 职场文书
2015年安全生产月工作总结
2015/07/27 职场文书
2015年国庆节标语大全
2015/07/30 职场文书
Python-typing: 类型标注与支持 Any类型详解
2021/05/10 Python
python使用shell脚本创建kafka连接器
2022/04/29 Python