New Webflow Update = Lenis Scroll⛔️

Design help General
1

Anyone know why WF’s most recent update has completely disabled Lenis Scroll on every single page on my website???

Thanks a million WF! :pray:t3:

Here is my site Read-Only: [LINK(https://www.zagg.studio/)]
(how to share your site Read-Only link)

1 Like
2

Hey Gareth,

Webflow’s update was to the designer layout, nothing to do with the published sites.

Check your browser console, the bug you’re seeing is in your custom code at the position you see in the screenshot. You’re trying to use the Webflow object before it has been created.

image
image1920×1141 147 KB

A typical approach you’ll find throughout this forum is this;

<script>
  var Webflow = Webflow || [];
  Webflow.push(function() {
    // your code here
  });
</script>
2 Likes
3

This started happening to me today as well, for some reason the webflow update has changed something.

The listed fix above worked for me.

The lenis clonable template is also broken at the moment.

( Link: Lenis Smooth Scroll - Webflow )

4

Hi @Gareth_Ellison

From Timothy Ricks (can’t find his username to tag him :cry: ) himself, here’s the updated code for lenis

<script>
let lenis = new Lenis({
  lerp: 0.1,
  wheelMultiplier: 0.7,
  gestureOrientation: "vertical",
  normalizeWheel: false,
  smoothTouch: false,
});
function raf(time) {
  lenis.raf(time);
  requestAnimationFrame(raf);
}
requestAnimationFrame(raf);
$("[data-lenis-start]").on("click", function () {
  lenis.start();
});
$("[data-lenis-stop]").on("click", function () {
  lenis.stop();
});
$("[data-lenis-toggle]").on("click", function () {
  $(this).toggleClass("stop-scroll");
  if ($(this).hasClass("stop-scroll")) {
    lenis.stop();
  } else {
    lenis.start();
  }
});
</script>

You can also check the updated YT video with instructions https://www.youtube.com/watch?v=5YhfjQmvJ3w&t=51s