Heim  >  Artikel  >  Web-Frontend  >  如何让网页中图片等待5秒再显示_html/css_WEB-ITnose

如何让网页中图片等待5秒再显示_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:22:402284Durchsuche

如何让网页中图片等待5秒再显示。

网页打开的时候,网页中的图片就会马上显示。如何让某一个图片,在网页打开后5秒在显示出来。


回复讨论(解决方案)

1. 图片载入有判别事件,在事件中设置图片对象的显示隐藏
2. 网页加定时器,到了5s,把指定图片显示出来

<style>#div1{height:100px;width:100px;background-color:yellow;display:none}</style><script type="text/javascript">	window.onload=function(){		var i=1;		setInterval(function(){			i++			if(i==5){				document.getElementById("div1").style.display="block";			}		},1000);	}</script><div id="div1">11222</div>

JS定时器setInterval

用js控制啊,setTimeout()

使用定时器setInterval

setTimeout()  是在事件触发之后的一定时间后执行定义的函数 只执行一次 执行时间自己定义
setInterval() 是在事件触发后每隔一定时间就执行一次 时间自定义 是重复执行
楼主自己选择吧

2楼代码错误很多:
1、根据要求,首先就应该用setTimeout()而不是setInterval(),这个7楼已经转录了函数说明。
2、而且要在5秒后显示的话,根本不需要设置一秒事件并进行计数,画蛇添足了。
3、如果使用setInterval(),在触发了显示操作之后,应该用clearInterval()来取消不必要的继续计时。

正确做法是直接使用setTimeout(),直接5秒一步到位:
如何让网页中图片等待5秒再显示_html/css_WEB-ITnose
<script> <br /> document.getElementById("theforever").style.display="none" <br /> setTimeout(function(){ <br /> document.getElementById("theforever").style.display="block"; <br /> } <br /> ,5000); <br /> </script>

$("object").delay("5000").animate();

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn