Sticky Scrolling Effect (Pro)

The Sticky Scrolling Effect lets you set a Section/Widget as sticky, so that it sticks to the top or bottom of the screen. 

sticky

Scrolling Effect

  1. Edit the Section/Widget by clicking its handle section settings
  2. Click the Advanced tab in the panel 
  3. Open the Motion Effects section
  4. Sticky: Choose to set your section to “stick” to the Top or Bottom of the screen, when scrolling
  5. Sticky On: Select on which devices your section will be sticky, Desktop, Tablet, or Mobile
  6. Offset: Pushes the sticky element up or down by pixels
  7. Effects Offset: The number of pixels the user must scroll before the sticky effect begins

Note: Effects Offset affects only if CSS was added to the sticky element. Here is an example of a typical set of CSS Rules that could be applied:

selector.elementor-sticky--effects {background-color: rgba(133,130,255,0.5)!important;}
selector {transition: background-color 4s ease !important;}
selector.elementor-sticky--effects >.elementor-container {min-height: 80px;}
selector > .elementor-container {transition: min-height 1s ease !important;}

Learn more about Sticky

Share it on social networks

Share on facebook
Share on twitter
Share on linkedin
Share on email

Did this answer your question?

255 people find it useful

Yes

No

Get Started With Elementor Today

Join millions of professionals who use Elementor to build WordPress websites faster and better than ever before