Elementor Sticky Headers: Hide Header on Scroll Down, Show On Scroll Up

Описание

In this tutorial, we'll hide the header on scroll down and show it on scroll up with Elementor sticky headers.

? The CSS snippet to style the highlighted text is can be found here - https://lytboxacademy.com/hide-header-on-scroll-down-show-on-scroll-up-with-elementor/

How to Create A Fully Shrinking Sticky Header (This effect with the hide and show on scroll effect work well together) ? https://youtu.be/ahpiYoGvnrc

? NEW ELEMENTOR DESIGN PROGRAM
The Official Design with Elementor Program (join the waitlist, enrollment opens Feb 1st!) ? https://lytboxacademy.com/design-with-elementor/



? BECOME A LYTBOX PRO MEMBER
The Lytbox Pro Academy ? https://lytboxacademy.com/the-academy/



? THE HOSTING I USE
CloudWays ? https://www.cloudways.com/en/?id=485185
Siteground ? https://www.siteground.com/index.htm?afcode=7ee222fccc8ee1d3b069390512775c30



? THE TOOLS I USE
Elementor Pro ? https://be.elementor.com/visit/?bta=4977&nci=5383
Crocoblock ? https://crocoblock.com/?ref=2021&campaign=yt
Dynamic Content for Elementor ? https://www.dynamic.ooo/?ref=129



? PERSONAL ELEMENTOR COACHING
1-On-1 Elementor Power Hour Training ? https://lytboxacademy.com/elementor-training/



Time Stamps ?
Starting the Tutorial - 1:12
Step 1: Edit Your Header Section - 1:51
Step 2: Copy & Paste JS Code Snippet - 3:36
Step 3: Adjusting the JS Code - 5:25
Step 4: Copy & Paste the CSS - 6:20
Step 5: Mobile Version - 8:03
Why Would We Add This Effect? 10:12



Thank you for supporting my channel ? - Jeffrey @ Lytbox

#elementorheader #elementorstickyheader