Smooth scroll not working with anchor links

Hi,

I am having problems getting smooth scroll working.

I have:
<a class="nav-item nav-link align-self-center" dmx-on:click="scroll_main_nav.goto('#!What_you_get')">What you get</a>

The smooth scroll I created via the smooth scroll by clicking on App:

Added Smooth Scrolling

And on the link I selected “Dynamic Event” and on Click and then Smooth Scroll and Goto as in screenshot below:

Hello,
What is not working exactly?

EDIT: i see a problem with your code:

scroll_main_nav.goto('#!What_you_get')"

this ! should not be there. The selector for IDs is #id_here not #!id_here

When click on the “What you get” link it does not scroll to the anchor link further down on the page.

I have a with an id to match:

<section class="bg-info style6" id="What_you_get">

See:

Yes, correct - Solved, thank you Teodor!

@Teodor the cursor doesn’t change to a hand/finger when hovering over the links to indicate to the user its a link? it changes to a cursor? How do I make the browser recognise its a link?

<a class="nav-item nav-link align-self-center" dmx-on:click="scroll_main_nav.goto('#!What_you_get')">What you get</a>

That’s because you removed the href from the anchor. This way it’s not recognized as a link by the browsers.
You can just add href="javascript:void(0)" to it.

1 Like