jquery插件Pace.js不工作
jquery插件Pace.js不工作
提问于 2015-02-07 17:20:47
我正在使用jquery pace.js，我希望在加载页面时，首先加载进度条，然后显示内容，这是我的代码。
<div class="pace pace-inactive">
<div class="pace-progress" data-progress-text="100%" data-progress="99" style="width: 100%;">
<div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div>
</div>小提琴将定义我工作的结果。
在我的例子中，内容和进度栏将同时显示。
我想要的东西：，首先，进度条将显示，在进度条完成后，内容将显示在这网站上。
更新：
这就是我接下来要尝试的，但是当进度完成时，它就不会显示任何内容.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>bk</title>
<link rel="stylesheet" href="css/pace-atom.css"/>
<style>
#contents {
display: none;
}
.cover {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 1999;
background:rgb(33,33,33);
}
</style>
</head>
<body class="pace-done">
<div class="pace pace-inactive">
<div class="pace-progress" data-progress-text="100%" data-progress="99" style="width: 100%;">
<div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div>
</div>
<div>
<div id="contents">
<img src="d3.jpg" alt=""/>
<img src="d1.jpg" alt=""/>
<img src="d2.jpg" alt=""/>
<img src="d2.jpg" alt=""/>
<img src="d1.jpg" alt=""/>
</div>
</div>
<script src="js/pace.js"></script>
<script type="text/javascript">
$(function() {
Pace.on("done", function(){
$("#contents").fadeIn(1000);
});
}
</script>
</body>
</html>回答 3
Stack Overflow用户
回答已采纳
发布于 2015-02-07 17:47:16
好的，实现这一点的一个简单方法是隐藏所有内容，直到pace完成加载(我假设佩斯的load屏幕有一个理由，但我不确定)。
所以您的内容可以有一个id #contents，并且是默认的display: none。然后，您可以像下面这样显示佩斯完成后的内容。
$(function() {
Pace.on("done", function(){
$("#contents").fadeIn(1000);
});
});下面是它工作的http://jsfiddle.net/59caubpx/3/的一个小提琴
Stack Overflow用户
发布于 2016-07-30 05:14:32
如果进度栏停留在99%，如果您正在使用Visual，则必须取消选中‘启用浏览器链接’选项。这将解决不完整的进度条问题。
Stack Overflow用户
发布于 2015-02-08 13:50:27
请检查是否正确地添加所有文件，如jquery.js、theme.atom.css或pace.js等.
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28385063
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号