How to refresh the Iframe url with Loading Image display
I want animate the I-Frame Loading its Source Page. I partially achieved my goal by using JavaScript code goes like this
function reloadIt()
{
frm=document.getElementsByName("pagers")[0]; //we get the iframe object
frm.src=frm.src; //or you can set the src to a new src
setTimeout("reloadIt()",100000); //the function will run every 60000 miliseconds, or 60 seconds
}
and my HTMl Body code goes here
<body onload="reloadIt()">
and my IFRAME Code Goes like this
<div id="divLoading">
<div style="width:100%; height:200px; align="center">
<img src="loader.gif" alt="" align="absmiddle"/>
</div>
<开发者_运维技巧;/div>
<div id="divFrameHolder" style="display:none">
<iframe src="lead.php" height="450px;" width="100%" name="pagers" onload="hideLoading()" > </iframe>`
</div>
and this works fine when this html page loads at first Time ,we can see loading Image in Iframe till Its source page loads. but after time interval when IFrame refreshes there is no loading image and its simply reloads its source page ... Can any body help me?
You might take a look at BlockUi, a jquery plugin. (http://jquery.malsup.com/block/#element). Try something like this:
function reloadIt() {
$("#iframeholder").block({
message: '<img src="css/ajax-loader.gif"/>',
css: { width: "600px;", height: "400px;" }
});
$('#pagers').attr('src', $('#pagers').attr("src"));
$('#iframeholder').unblock()
setTimeout("reloadIt()", 5000);
}
加载中,请稍侯......
精彩评论