zoukankan      html  css  js  c++  java
  • 慢工出细活 JS 等待加载效果

    实例可以直接运行查看效果。很方便快捷

    [html] view plain copy
    1. <html>   
    2. <head>   
    3. <meta http-equiv="content-Type" content="text/html;charset=gb2312">   
    4. <style type="text/css">   
    5. <!--   
    6. *{margin:0;padding:0;}   
    7. .ifr_div{600px;height:600px; position:relative;}   
    8. .ifr_div img{ vertical-align:middle;}   
    9. .proccess{border:0px solid;border-color:#009900;height:600px;line-height:600px;600px;text-align:center;background:#eee;margin:0;position:absolute;top:0;left:0;}   
    10. .proccess b{vertical-align:middle;background:url(http://ok22.org/upload/images/20110902143538381.gif) no-repeat 0 center;padding-left:35px;display:inline-block;}   
    11. -->   
    12. </style>   
    13. </head>   
    14. <body>   
    15. <div class="ifr_div">   
    16.     <div class="proccess" id="loading"><b>正在加载中。。。</b></div>   
    17.     <iframe id="sfa" name="sfa" frameborder="0" scrolling="auto" height="600" width="600"></iframe>   
    18. </div>   
    19. <script language="JavaScript">   
    20. var iframe = document.getElementById("sfa");    
    21. iframe.src = "http://www.ok22.org";    
    22. if (iframe.attachEvent){    
    23.     iframe.attachEvent("onload", function(){   
    24.     document.getElementById("loading").style.display="none";   
    25.     });    
    26. } else {  www.2cto.com  
    27.     iframe.onload = function(){   
    28.     document.getElementById("loading").style.display="none";   
    29.     };    
    30. }    
    31. </script>   
    32. </body>   
    33. </html>
    我今天终于有了自己的qian,欢迎lady gentlemen为我的捧场! 虽然我不认识的所有GGMM,不过我相信我的空间一定是独一无二的! 我喜欢交朋友,如果你想和我多聊一些,给我留言,发小纸条或者直接加我好友吧! 另外,如果你在其他博客上有日记或者照片,可以用(http://n.qzone.qq.com/move/move_login.htm)把它们分享生活新体验!:)
  • 相关阅读:
    Largest Rectangle in Histogram
    Valid Sudoku
    Set Matrix Zeroes
    Unique Paths
    Binary Tree Level Order Traversal II
    Binary Tree Level Order Traversal
    Path Sum II
    Path Sum
    Validate Binary Search Tree
    新手程序员 e
  • 原文地址:https://www.cnblogs.com/paper-file/p/7007220.html
Copyright © 2011-2022 走看看