Jes*_*per 4 javascript gif onload animated
我有一个使用asp.net(C#)生成服务器端的页面.加载页面需要一段时间,因为它最多有100个iframe.我想在页面加载时显示"请等待"动画gif,所以我有以下内容:
<style type="text/css">
#blackout
{
filter:alpha(opacity=70);
-moz-opacity:0.7;
opacity:0.7;
position:absolute;
background-color:#222233;
z-index:50;
left:0px;
top:0px;
right:0px;
bottom:0px;
width:102%;
height:102%;
}
#loading
{
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
position:fixed;
text-align:center;
background-color:#EEEEEE;
top:50%;
left:50%;
margin-top:-55px;
margin-left:-75px;
width:150px;
height:75px;
z-index:100;
}
</style>
</head>
<body onload="document.getElementById('loading').style.visibility='hidden';document.getElementById('loading').style.display='none';document.getElementById('blackout').style.visibility='hidden';document.getElementById('blackout').style.display='none';">
<div id="blackout">
<div id="loading"><img id="loadinggif" src="graphics/loading.gif" alt="" style="margin-top:12px; "/><br />Please wait...</div>
<script type="text/javascript" language="javascript">
document.getElementById('loadinggif').src = 'graphics/loading.gif';
</script>
</div>
<form id="form1" runat="server">
所以问题是加载gif没有移动.我试过用
setTimeout("document.getElementById('loadinggif').src = 'graphics/loading.gif'", 100);
它也使得GIF移动"一点点",但并不像预期的那样.
如何在加载过程中使其无中断动画？
setTimeout(function(){document.getElementById('loadinggif').src = 'graphics/loading.gif'}, 100);
将其作为函数包含并观察您的报价
你可能想这样做。在html中声明src但将其隐藏，然后执行：
setTimeout(
function() {
document.getElementById('loadinggif').style.display ='block';
setTimeout(
function() {
document.getElementById('loadinggif').style.display = 'none';
}, 100);
}, 100);