How to navigate to certain HTML-section?

p5.js Coding Questions
1

Hi!

I believe my problem is fairly simple, but I just couldn’t find any answers:

My p5-sketch is embedded inside a single-page website. When I click on a certain element inside the sketch, I want to scroll down to a certain section within the website.

How do Iachieve this? I was hoping there would be a dom-function like navigateTo(’#about’) or something like that…

Thanks for your help!

2

Yeah name tag

Then a normal link href with #about as target

3

OK, the thing is that I don’t have a link inside my sketch. To be more precise, I want to navigate to #about, when i click on a p5.Graphics-element inside the sketch. That’s why I need a p5-function that navigates to the section, instead of a html-element. Does this make sense?
Thanks!

4

You can probably add a JavaScript function that’s executed once your P5 button is pressed. Various solutions are discussed on:

Does one of these solutions work for your situation?

1 Like
5

Thank you! The following code worked for me in the end:

    document.getElementById("about").scrollIntoView({
      behavior: 'smooth'
    });
3 Likes