locomotivemtl / locomotive-scroll

🛤 Detection of elements in viewport & smooth scrolling with parallax.
https://locomotivemtl.github.io/locomotive-scroll
MIT License
7.83k stars 1.12k forks source link

update() not calculating the page height correctly, only after refreshing the page, using webflow #541

Open Kugges opened 9 months ago

Kugges commented 9 months ago

Hello guys,

i have the issue, that the page height won't be calculated correctly when loading the page after publishing. i have to refresh the page first every time i publish changes so the height is calculated correctly again.

my code:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/locomotive-scroll@3.5.4/dist/locomotive-scroll.css">
<script src="https://cdn.jsdelivr.net/npm/locomotive-scroll@4.1.1/dist/locomotive-scroll.min.js"></script>
<script>
const locoScroll = new LocomotiveScroll({
  el: document.querySelector(".locomotive-scroll"),
  smooth: true,
  smartphone: {
      smooth: true
  },
  tablet: {
      smooth: true
  },
    smoothMobile: 1,
  multiplier: 1.0,
});

// Wait 2 seconds then calculate the new page height
setTimeout(() => {  
    locoScroll.update();
}, 2000);

</script>

hereby i'm referring to the docs https://timothyricks.notion.site/Locomotive-Scroll-cfdc6b5523ed43cea0412069a534f07c

the locoScroll.update(); in the end seems to be the problem as i can see from other issues in here, i also tried other functions posted in here, but nothing worked so far for me.

this here is my website: https://qapsa-green.webflow.io/#machine if you scroll further down to the next section ("Output Yield"), the image on the left side will be stuck behind the table below, but it should stop way more up. if you refresh the page, the image will be positioned correctly.

image

EDIT: i removed the update() function and it didn't do any changes, so maybe it is not the culprit here

khalua commented 7 months ago

same issue