zoukankan      html  css  js  c++  java
  • 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"; 
    
    
    
    } 
    
    
    
    } 
    
    
    
    //]]> 
    
    
    
    
    
    
    
    </script>

     iframe加载内容页实现LOADING效果,即iframe加载的内容完全下载完后现显示出来。LOADING消失

  • 相关阅读:
    Intent
    关注博客
    Bitmap
    图片压缩
    读取相册、拍照
    Godot开发环境与学习资源
    源码开放的引擎研究
    海龟交易法操作商品期货
    重新开始
    使用node_redis进行redis数据库crud操作
  • 原文地址:https://www.cnblogs.com/blueskycc/p/4978741.html
Copyright © 2011-2022 走看看