请选择 进入手机版 | 继续访问电脑版
开启辅助访问
帐号登录 |立即注册

jQuery实现网页打开显示loading加载效果

 
实现原理:页面一打开显示loading图标,当页面加载完时,触发 completeLoading 函数,js隐藏loading图标
[JavaScript] 纯文本查看 复制代码
<style type="text/css">
#loading{
    position:fixed;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    z-index:99999;
    background:rgba(255,255,255,1);
}
#loading img{
    display:block;
    margin:0 auto;
    width:60px;
    height:60px;
    position:relative;
    top:50%;
    margin-top:-30px;
}


</style>
<div id="loading"><img src="/public/static/admin/base/images/loading2.gif"/></div>
<script type="text/javascript">
        document.onreadystatechange = function () {
        if (document.readyState == "complete") {
            $("#loading").animate({"opacity": "0"}, 500,function(){
                                $("#loading").hide();
                        });
        }
    }
</script>
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

友情链接
  • 艾Q网

    提供设计文章,教程和分享聚合信息与导航工具,最新音乐,动漫,游戏资讯的网站。