Archived topic
smooth scroll // how to
11 replies · Started by Sebastien on June 4, 2019
Hi,
Smooth Scroll doesn't work into my website.. =/
I've writen some anchors along my front page. Then I've writen some link to point to these anchor:
<a class="smooth-scroll" href="#application">My Section</a>
When I click into the link, it links me to the right anchor #application, but there is no any smooth scroll effect =/
I've also add:
add_filter( 'generate_smooth_scroll_duration', 'tu_smooth_scroll_duration' );
function tu_smooth_scroll_duration() {
return 800; // milliseconds
}but that doesn't work.. Any idea?
thanks
Hi there,
have you activated the smooth scroll option in Customizer > General ?
Yes I have already activated this option
Clicking the Section link is working for me. Maybe try clearing the browser cache.
I've noticed it also work with smartphone devices... but neither with my desktop Chrome or Firefox after full cleared...
humm strange..
Working fine for me on all browsers - any browser extensions that could be conflicting ?
Hello. Related to the smooth scroll behaviour:
- If I apply smooth scroll to regular links (https://docs.generatepress.com/article/smooth-scroll/#regular-links), all is good to go, it works as expected, but...
- I tried to apply the smooth-scroll class to a headine on GenerateBlocks. The behaviour changes and the anchor link sends me under the Element ID. Is it a trick here?
I made a short VIDEO HERE to explain better.
Thank you for your support.
Marcel
Ah, the custom class option in GenerateBlocks adds the class to the headline element, not the anchor.
Try adding this filter:
add_filter( 'generate_smooth_scroll_elements', function( $elements ) {
$elements[] = '.gb-headline.smooth-scroll a';
return $elements;
} );Let me know :)
Tom, thank you very much for the solution. It is working properly now!
Glad I could help :)
Hi there,
Where should that filter code be placed? I just tried to place it in my "Code Snippets" plugin to activate it and enable the headline text to be scrolled down to upon clicking a button with the anchor, but it's still moving down to the point on the page without smooth scroll.
Hi there,
the Code Snippets plugins is correct to use.
Have you selected the Headline Block and in Advanced > Additional CSS Class(es) added: smooth-scroll ?
