JavaScript实现定时隐藏与显示图片的方法

前端技术 2023/09/08 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=\"http://www.phpstudy.net/images/logo.gif\" >
 </DIV>
</center> 
</body>
</html>

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

本文地址:https://www.stayed.cn/item/21911

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。