momotive.js加载时平滑滚动更新()

Question

我使用的是motive.js(https://locomotivemtl.github.io/locomotive-scroll/)在wordpress网站上。它运行得很好，直到我上传到实时服务器。在实时服务器上，元素有时会相互碰撞，然后闪烁消失，页脚也会被切断

我认为这一定与页面未加载有关，我需要使用update((来检查页面是否已加载。但我不知道如何更改它来检查页面加载而不是超时——有人能帮忙吗？

function smooth() {
let scrollContainer = document.querySelector('your-selector');
scroll = new LocomotiveScroll({
el: scrollContainer,
smooth: true    });
setTimeout(() => {
scroll.update();
}, 500); 
}

Answer 1

我们必须检测要加载的图像和大型资产您应该使用imageLoaded来检测所有图像加载，然后您必须更新滚动，它应该可以正常工作

const imagesLoaded = require("imagesloaded"); // import the library or can use cdn

let scrollContainer = document.querySelector("[data-scroll-container]");
var scroll;
scroll = new LocomotiveScroll({
el: scrollContainer,
smooth: true,
getSpeed: true,
getDirection: true,
offset:["15%",0]
});


/* update scroll (height) when all images are loaded */
imagesLoaded(scrollContainer, { background: true }, function () {
scroll.update();
});