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

本文实例讲述了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://wwwww.jb51.net/"
// 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程序设计有所帮助。

赞 (0)

相关推荐

  • JS动态加载当前时间的方法

    本文实例讲述了JS动态加载当前时间的方法.分享给大家供大家参考.具体实现方法如下: <body bgcolor="#fef4d9" onload ="time()"> <script language="JavaScript"> function time () { var now = new Date(); var yr = now.getYear(); var mName = now.getMonth() + 1; v

  • 基于Jquery的温度计动画效果

    基于Jquery的温度计动画效果

    设计图如下:1.xhml 复制代码 代码如下: <div id="mometer"> <div id="hot"></div> <span> <div id="Hgheader">0℃</div> <div id="Hg"></div> </span> </div> <input name="

  • js控制当再次点击按钮时的间隔时间

    复制代码 代码如下: <script type="text/javascript" language="javascript"> var wait = 60; function change() { $o = $("#J_refresh_checkcode"); if(wait == 0) { $o.removeAttr("disabled"); $o.html("看不清?换一张"); wait

  • js获取时间并实现字符串和时间戳之间的转换

    废话少说,直接上代码 复制代码 代码如下: //获取当前时间:   var myDate = new Date();//当前时间   var year = myDate.getFullYear();//当前年份   var month = myDate.getMonth() + 1;//当前月份   var day = myDate.getDate();//当前日   myDate.getYear();        //获取当前年份(2位)     myDate.getFullYear(); 

  • JS实现可调整倒计时间代码分享

    JS实现可调整倒计时间代码分享

    这是一款基于javascript实现可调整倒计时间的代码,我们可以手动调整倒计时间,可以精确到"天.时.分.秒",而且样式布局也很新颖. 先上运行效果图: 效果演示     源码下载 为大家分享的可调整倒计时间的JS代码如下(浏览器中如果不能正常运行,可以尝试切换浏览模式). <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&g

  • js实现温度计时间样式代码分享

    js实现温度计时间样式代码分享

    这是一款基于js实现温度计时间样式代码,与我们见过的日期显示都不一样,很有创意,分享给大家学习学习 运行效果图:----------------------查看效果----------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的javascript实现温度计时间样式代码如下 <title> 温度计式样的时间 </title> <SCRIPT language=javascript> var cellwidth=10;

  • js获取当前时间显示在页面上并每秒刷新

    方法很简单,代码也很简洁,直接奉上代码吧 复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js获取当前时间显示在页面上</title> <script> window.onload=function(){ //定时器每秒调用一次fnDate() setInterval(f

  • JS获取时间的方法

    本文实例讲述了JS获取时间的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml">  <head>      <title></title>      <script type="text/javascript">          function Case(i) {              if (i

  • js实现在网页上简单显示时间的方法

    本文实例讲述了js实现在网页上简单显示时间的方法.分享给大家供大家参考.具体如下: 这是一款网页时钟JS代码,纯javascript实现,显示时.分.秒.网页时间显示.网页时钟有很多,这个真的挺简易的,美工好的朋友可在此基础上进一步美化完善 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tr

  • js获取当前日期时间及其它操作汇总

    js获取当前日期时间及其它操作汇总 var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4位,1970-????) myDate.getMonth(); //获取当前月份(0-11,0代表1月) myDate.getDate(); //获取当前日(1-31) myDate.getDay(); //获取当前星期X(0-6,0代表星期天) myDate.getTime(); /

  • js图片滚动效果时间可随意设定当鼠标移上去时停止

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> &l

随机推荐