JavaScript实现定时隐藏与显示图片的方法
编程学习 2021-07-04 21:48www.dzhlxh.cn编程入门
这篇文章主要介绍了JavaScript实现定时隐藏与显示图片的方法,可实现javascript定时关闭图片的功能,涉及javascript针对页面元素属性定时操作的相关技巧,需要的朋友可以参考下
本文实例讲述了JavaScript实现定时隐藏与显示图片的方法。分享给大家供大家参考。具体如下：
这里使用JavaScript实现定时隐藏与显示图片，设定图片在几秒后会自动显示，也会自动隐藏，秒数这个自己去定义吧，在JavaScript代码片段内。
运行效果如下图所示：
具体代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>定时隐藏图片</title>
</head>
<SCRIPT LANGUAGE="JavaScript">
var sec=10;
var timer;
function hidepic()
{
sec--;
if (sec==0){
textfield.value = "图片被隐藏";
soccer.style.visibility =(soccer.style.visibility == "hidden") ? "visible" : "hidden";
}
else{
textfield.value = "图片会在 "+sec+" 秒后隐藏";
setTimeout("hidepic()",1000);
}
}
</SCRIPT>
<body onLoad = "hidepic();">
<center>
<input name="textfield" type="text" size="20"> <br>
<DIV ID="soccer" STYLE="position:absolute; left:333px; top:43px">
<img border="0" src="https://www.jb51.net/images/logo.gif" >
</DIV>
</center>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。