首页 > Web开发 > 详细

HTML一个极其简单实用的浏览器加载效果

时间:2019-09-02 20:23:25      阅读:63      评论:0      收藏:0      [点我收藏+]
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>加载效果demo</title>
  <!--引入jQuery-->
  <script src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.js"></script>
  <style>
    #tipDiv{
        display:none;
        position: absolute;
        left: 39%;
        top: 230px;
        z-index: 9999;
        background: #d9d9d9;
        padding: 10px;
        border-radius: 5px;
    }
    #tipInfo{
        margin-top: 10px;
    }
  </style>
 </head>
 <body>
  <!--主要的div 使用的时候把这段引用到自己的界面中-->
  <div id="tipDiv">
    <center><img style="width:25px;" src="http://img.lanrentuku.com/img/allimg/1212/5-121204193R5-50.gif"></center>
    <div id="tipInfo"></div>
  </div>
 
  <script type="text/javascript">
    //显示提示
    function showTip(info){
        $(#tipInfo).html(info);
        $(#tipDiv).show();
    }
    //初始加载提示
    showTip(内容正在加载...);
    //关闭提示
    function closeTip(){
        $(#tipDiv).hide();
    }
  </script>
 </body>
</html>

来自微信公众号:编程社

技术分享图片

程序员日常进阶宝典,欢迎关注!

 

 

HTML一个极其简单实用的浏览器加载效果

原文:https://www.cnblogs.com/ai10999/p/11448663.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!