我正在将Pace.js(http://github.hubspot.com/pace/)用于基本加载程序。
到目前为止，它运行良好，没有任何问题。但是，我想做的是将Pace.js HTML附加到我选择的元素中。
生成的HTML看起来像:
<div class="pace pace-inactive">
<div class="pace-progress" data-progress-text="100%" data-progress="99" style="transform: translate3d(100%, 0px, 0px);">
<div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div>
</div>
默认情况下，Pace.js会将其自身附加在开头
<body>标记之后。是否有任何方法可以了解生成的HTML的去向？ 最佳答案
好的，我知道了。它似乎没有记录。
在plugins options对象中，target键有一个值。
默认选项如下:
defaultOptions = {
catchupTime: 500,
initialRate: .03,
minTime: 500,
ghostTime: 500,
maxProgressPerFrame: 10,
easeFactor: 1.25,
startOnPageLoad: true,
restartOnPushState: true,
restartOnRequestAfter: 500,
target: 'body',
elements: {
checkInterval: 100,
selectors: ['body']
},
eventLag: {
minSamples: 10,
sampleCount: 3,
lagThreshold: 3
},
ajax: {
trackMethods: ['GET'],
trackWebSockets: true,
ignoreURLs: []
}
};
在我的项目中，我正在使用Browserify，所以这是我实现的方法:
var pace = require('../plugins/pace');
pace.options.target = '#main';
pace.start();
这有效地覆盖了Pace.js使用的默认选项中的
target键。似乎现在工作正常。希望这可以帮助其他人。