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 相关文章推荐
Javascript 面向对象 对象(Object)
May 13 Javascript
Node.js中的流(Stream)介绍
Mar 30 Javascript
浅谈$(document)和$(window)的区别
Jul 15 Javascript
JavaScript继承学习笔记【新手必看】
May 10 Javascript
BootStrap的alert提示框的关闭后再显示怎么解决
May 17 Javascript
JS敏感词过滤代码
Dec 23 Javascript
Angular中ng-repeat与ul li的多层嵌套重复问题
Jul 24 Javascript
关于定制FileField中的上传文件名称问题
Aug 22 Javascript
实现单层json按照key字母顺序排序的示例
Dec 06 Javascript
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 jQuery
详解js的视频和音频采集
Aug 09 Javascript
JS自定义右键菜单实现代码解析
Jul 16 Javascript
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
用PHP制作静态网站的模板框架(三)
2006/10/09 PHP
php更改目录及子目录下所有的文件后缀的代码
2010/09/24 PHP
关于zend studio 出现乱码问题的总结
2013/06/23 PHP
php中mail函数发送邮件失败的解决方法
2014/12/24 PHP
php curl 获取https请求的2种方法
2015/04/27 PHP
JavaScript 节点操作 以及DOMDocument属性和方法
2007/12/06 Javascript
js利用Array.splice实现Array的insert/remove
2009/01/13 Javascript
jQuery的实现原理的模拟代码 -3 事件处理
2010/08/03 Javascript
js调用图片隐藏&amp;显示实现代码
2013/09/13 Javascript
jquery实现的横向二级导航效果代码
2015/08/26 Javascript
浅析js中substring和substr的方法
2015/11/09 Javascript
JavaScript Math.round() 方法
2015/12/18 Javascript
JS简单获取客户端IP地址的方法【调用搜狐接口】
2016/09/05 Javascript
jQuery Tree Multiselect使用详解
2017/05/02 jQuery
原生js的ajax和解决跨域的jsonp(实例讲解)
2017/10/16 Javascript
轻松理解vue的双向数据绑定问题
2017/10/30 Javascript
Angular实现的进度条功能示例
2018/02/18 Javascript
AngularJs的UI组件ui-Bootstrap之Tooltip和Popover
2018/07/13 Javascript
vue.draggable实现表格拖拽排序效果
2018/12/01 Javascript
jQuery实现的别踩白块小游戏完整示例
2019/01/07 jQuery
基于vue实现一个神奇的动态按钮效果
2019/05/15 Javascript
jquery实现购物车基本功能
2019/10/25 jQuery
微信小程序如何加载数据库真实数据的实现
2020/03/04 Javascript
详解在Python程序中解析并修改XML内容的方法
2015/11/16 Python
Python 详解基本语法_函数_返回值
2017/01/22 Python
浅谈python中copy和deepcopy中的区别
2017/10/23 Python
Python实现PS滤镜功能之波浪特效示例
2018/01/26 Python
python的Jenkins接口调用方式
2020/05/12 Python
python中Mako库实例用法
2020/12/31 Python
分享29个基于Bootstrap的HTML5响应式网页设计模板
2015/11/19 HTML / CSS
SportsDirect.com新加坡:英国第一体育零售商
2019/03/30 全球购物
洗煤厂厂长岗位职责
2014/01/03 职场文书
法制宣传标语集锦
2014/06/25 职场文书
校园歌手大赛主持词
2015/07/03 职场文书
校园之声广播稿
2015/08/18 职场文书
干货:如何写好工作计划!
2019/05/17 职场文书