# How to navigate to certain HTML-section?

**URL:** <https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111>\
**Category:** Coding Questions\
**Created:** [September 22, 2019, 3:37pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111 "2019-09-22T15:37:35Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![hut](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hut/32/6507_2.png) [@hut](https://discourse.processing.org/u/hut)\
**Post date:** [September 22, 2019, 3:37pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111/1 "2019-09-22T15:37:35Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [September 22, 2019, 3:42pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111/2 "2019-09-22T15:42:15Z")

</div>

Yeah name tag

Then a normal link href with #about as target

---

<div class="post-metadata">

**Author:** ![hut](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hut/32/6507_2.png) [@hut](https://discourse.processing.org/u/hut)\
**Post date:** [September 22, 2019, 4:13pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111/3 "2019-09-22T16:13:11Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![Tiemen](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tiemen/32/5477_2.png) [@Tiemen](https://discourse.processing.org/u/Tiemen)\
**Post date:** [September 22, 2019, 8:23pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111/4 "2019-09-22T20:23:36Z")

</div>

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

- [https://stackoverflow.com/questions/3163615/how-to-scroll-html-page-to-given-anchor](https://stackoverflow.com/questions/3163615/how-to-scroll-html-page-to-given-anchor)

Does one of these solutions work for your situation?

---

<div class="post-metadata">

**Author:** ![hut](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hut/32/6507_2.png) [@hut](https://discourse.processing.org/u/hut)\
**Post date:** [September 26, 2019, 1:20pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111/5 "2019-09-26T13:20:27Z")

</div>

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

```auto
    document.getElementById("about").scrollIntoView({
      behavior: 'smooth'
    });

```
