Modules Smooth Scroll
Smooth Scroll
Mouse-wheel scrolling that glides to a stop in Pro, and same-page links that glide to their section and land just below the header in the free plugin. It runs on the browser's own scrolling, so every effect on this page stays in sync. Touch screens, the keyboard and visitors who prefer reduced motion keep normal scrolling.
↓ Scroll with a mouse wheel or trackpad and the page glides. Or jump to a section:
Live demo · Pro
Every effect stays in sync
Image reveals, parallax and scroll-linked fades read the real scroll position, so they ease along with the glide instead of jumping a step at a time.
Rows too
A whole section, revealed as you glide past
Scroll-linked effects follow the eased scroll frame by frame, so nothing stutters or snaps.
Live demo · Free
Anchor links that land in the right place
Links to a section of the same page glide there and stop just below the sticky header, so the heading is never hidden. Try them:
Jump to scrollable boxes ↓ Back to the effects ↑ Back to the top ↑
- Keyboard focus moves to the section, so the next Tab continues from there
- The address bar updates, so the link can be shared and Back returns you
- A page opened at a #section lands below the header too
- Visitors who prefer reduced motion jump straight there
Live demo · Pro
Scrollable boxes stay native
Anything with its own scrollbar, such as this box, a map or an embed, scrolls normally under the pointer. Add the class kinetic-scroll-native to keep any other element native.
Built on native scrolling
The page still scrolls itself: smooth scroll only eases where it goes, so sticky rows, horizontal scroll, stacking cards and CSS scroll timelines keep working.
Never on touch
Phones and tablets already have momentum scrolling, so smooth scroll stays out of the way there.
Reduced motion
Visitors who ask their device for less motion get normal scrolling and instant anchor jumps.
Keyboard and scrollbar
Arrow keys, Page Down, Space, the scrollbar and find-in-page all scroll natively.
Full-page sections
Pages with full-page sections or CSS scroll snapping switch smooth scroll off on their own.
Per page
Pick the whole site, the front page or chosen pages, and turn it off on any page from a row's Kinetic tab.
In the builder
The Beaver Builder editor always scrolls normally while you work.
Scroll inside the box: it moves on its own, then the page carries on when it reaches the end.
How to use it
Where to find it
Go to Settings → Kinetic Modules. Switch on Smooth anchor links (free) or Smooth scroll (Pro) under Modules & extensions, then set the glide time, the pages it runs on and an extra offset for anchor links under Scrolling. To keep smooth scroll off on one page, open a row's Kinetic tab and choose Smooth scroll → Turn smooth scroll off.
Both are off until you switch them on. Smooth scroll never runs on touch screens, with reduced motion, in the builder or on pages with full-page sections.
Free In the free plugin
- Smooth anchor links that glide to sections of the same page
- Land below sticky and Beaver Themer headers, with an extra offset
- Keyboard focus and the address bar follow the jump
- Instant jump for visitors who prefer reduced motion
Free version coming soon to WordPress.org
Pro Pro adds
- Smooth mouse-wheel scrolling with a glide time and wheel distance
- On the whole site, the front page or chosen pages
- In sync with every scroll effect, sticky row and horizontal scroll
- Turn it off on any page from a row's Kinetic tab
Kinetic Modules
Make your Beaver Builder sites move.
Start with the free plugin. Add Pro when a project needs the big effects.