javscript 实现iframe加载内容页出现LOADING效果

代码
< div  id ="load"  align ="center" >

< img  src ="http://sc.cnwebshow.com/upimg/allimg/070707/01294420.gif"   />  loading

</ div >   <!--  首先放一个div,用做loading效果  -->

< iframe  id ="demo"  src ="http://www.****.com"  width ="100%"  height ="800"  frameborder ="0"  scrolling ="no"  marginheight ="0" ></ iframe >   <!--  src 里面放你想要的网页 -->

< script  type ="text/javascript" >  

// <![CDATA[ 

var  a  =  document.getElementById( " demo " ); 

var  b  =  document.getElementById( " load " ); 

a.style.display 
=   " none " // 隐藏 

b.style.display 
=   " block " // 显示

a.onreadystatechange 
=   function () { 

if  ( this .readyState == " complete " ) {  // 最近才知道的。不然也写不出来。

//  解释:一个iframe加载完毕的状态是complete,

//  就象xmlhttp里的那个==4一样,这些都是规定的

b.innerHTML 
=   " load complete! "

b.style.display 
=   " none "

a.style.display 
=   " block "


// 兼容Firefox/Opera/Safari/IE的处理方式。
//
a.onload=a.onreadystatechange = function() { 

//   if (this.readyState&&this.readyState != 'complete')
//
  { 
//
  b.style.display = "none"; 

// a.style.display = "block"; 
//
  return;}
//
  else
//
 { 
// b.style.display = "none"; 

// a.style.display = "block"; 

//

//


}
// ]]> 



</ script >  

 


你可能感兴趣的:(iframe)