[Resolved] Possible to Fire Smooth Scroll Via Script?

[Michael]

Howdy,

I know how to add the “smooth-scroll” class to link elements to hook into your Smooth Scroll script library. But I was curious if there might be a way to fire this programmatically in a JS block (without jQuery, ideally).

The scenario is that we’re loading some content on the page via an ajax script, but then I want to window to scroll down the ID containing the updated ajax content after things are loaded.

It’s odd that I haven’t run into this scenario after all these years, and I can’t find anything in the forums. Sorry if this has already been answered or if the solution is painfully obvious. I’m sure more sleep would help me in either case, haha!

Thank you so much for any help you can provide here 😛

Michael

[Fernando]

Hi Michael,

For further context, can you provide the link to the specific page in question?

You may use the private information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

And possibly, provide a little more context. For instance, are you trying to add the “smooth-scroll” class to an element loaded through your AJAX script? Or, is the “smooth-scroll” not working as expected on the elements loaded from that script?

Hope to hear from you soon! 🙂

[Michael]

There isn’t a live site yet, I’m afraid. It’s still in fairly early local development.

But as for the context, I’ll do my best to clarify a bit. The challenge is really for a vanilla javascript function to programmatically fire a “smooth scroll” event (in this specific case we would fire that event after an AJAX call to rewrite some html on the page, but that part probably isn’t relevant to the core question).

Basically, I’m curious if I can trigger a smooth scroll event without someone having to specifically click on a link with that “smooth-scroll” class? I just want to trigger the scroll via javascript, if that makes sense?

Thanks so much!

[David]

Hi there,

is the Ajax callback a custom function or from a plugin?

[Michael]

It’s a custom function, built with vanilla javascript.

[David]

So the GP Smooth scroll, simply ‘hijacks’ the links default behaviour and introduces a smooth scroll animation. It itself doesn’t create the link.

You could just add the scrollTo or similar action in your AJAX Success callback. Some examples of that here:

https://stackoverflow.com/a/13736194

[Michael]

David,

Thanks so much for this info! Just tested it out on my dev site and it seems to take care of the actual scroll, which is the primary goal. The smooth part is something I can keep working on, but this puts me on the right path I think. Much appreciated!

Michael

[David]

Glad to be of help.

[Author]

Posts