Streaming live at 10am (PST)

Scroll down to anchor after making visible


#1

I’d like to make a section visible, then scroll down to it. So I have an interaction set up which makes a section visible, and then under buttons settings > Link settings. I’ve set up a page section link linked to the ID of the section that is made visible. However, I think I’ve run into a racing condition problem where the visibility of the section is executed after the page link function and so it’s not working (it does work if I click the button a second time, once the section is already visible)

So I’m guessing one way to approach this would be to write some custom code linked to the button which then scrolls down to the new section(perhaps in a setInterval). However, I don’t know what to execute. Maybe I’m just being daft but I can’t find a link to the Webflow Javascript reference. The only thing I’ve found is the CMS API Reference which isn’t really what I’m looking for.

Anyone know the javascript function I can call? Better yet a reference page to all the available webflow functions would be great.

Here is the broken version:
https://preview.webflow.com/preview/retirement-benefits-counselling?utm_source=retirement-benefits-counselling&preview=a4299573552b59e09d77ebd912c953b8


Here is my public share link:
https://preview.webflow.com/preview/retirement-benefits-counselling?utm_source=retirement-benefits-counselling&preview=a4299573552b59e09d77ebd912c953b8

(how to access public share link)


#2

Here’s how I did it.

<script>
$('#step_1_btn').on('click', function (evt) {
   var id = setInterval(frame, 100);
   function frame() {
      $('html, body').animate({
          scrollTop: $("#step2").offset().top
          }, 750);   
          
      clearInterval(id)
  }
evt.preventDefault();
});
</script>