By using’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Wordpress and Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor

    Join us!
elementor official

Question Adding 'scroll-snap-type' function using Elementor



New Member
I'm currently building myself a new portfolio website and Elementor is working a treat for me to finally get the look and layout I want.

One feature I'm wanting to add is the ability for the page to snap to the closest container/Section on the screen.

I found a post explaining what would need to be done in a normal HTML environment. However I'm unsure about how I would implement this into an Elementor page made up of a series of Sections.

If anyone has experience with this kind of thing I'd greatly appreciate any guidance you have to offer!
Last edited:


New Member
I use CSS Scroll-Snap on my homepage but the problem is that it doesn't work properly on Desktop without some JS to drag around so that i only enabled scroll-snap on Mobile devices only. Because you don't scroll on mobile you swipe.

If you want to use Scroll-snap on your project using Elementor pro : Drag and drop HTML widget and start writing HTML, CSS and JS ( if necessary)

Here the tutorials i use

1. alligator. io/css/scroll-snapping/
2. css-tricks. com/practical-css-scroll-snapping/
3. developer.mozilla. org/en-US/docs/Web/CSS/scroll-snap-type

Latest Resources

Other Elementor Resources

elementor official