How to scroll to part of page when nav link is clicked

Bootstrap Studio Help
1

what do I to make it so it scrolls to part of page when nav link is clicked I know it requires some javascript, but im looking for where to get started

but in one of the templates , "free-lancer" this javascript is used, I just don't know how to incorporate this into my bootstrap studio website

2

No javascript is needed. What you're talking about is called an "anchor link."

You simply give the component on the page that you want the link to scroll to a unique ID (the ID field is in the Attributes part of the HTML panel at the bottom of the program workspace.) Then you make the URL of the link the same as the ID.

So, for example, if you gave the component an ID of "anchor" (no quotes), you'd then make the URL of your link #anchor (with the # sign in front of it.)

https://www.w3docs.com/snippets/html/how-to-create-an-anchor-link-to-jump-to-a-specific-part-of-a-page.html

3

thank you! but how would I make this transition smoother, not just jump to it.

4

You can either use CSS by adding this class html { scroll-behavior: smooth; }

I think this doesn't work in desktop Safari, or Opera though.

Or there are lots of free javascript plug-ins, for example https://github.com/cferdinandi/smooth-scroll