Sticky Header Effects
for
Create custom header that's perfect for you
You can change the header background color, height, logo size, and bottom border when the visitor starts scrolling down the page.
Features
Options On Scroll
The scrolling distance is adjustable for the best results in any situation
Transparent Header
Makes the initial background color transparent and places the header over the top page section without the use of negative margins
Section Height
Fully responsive and allows for a “shrink” effect to maximize space and achieve a slim style without losing functionality
Background Color
Change the color of the header when the visitor begins to scroll down. Full HEX, RGBA, and Color Name support
Coming Soon
Replace logo
Change logo image entirely. Especially usefully when using transparent header
Entrance animations
Slide-in and fade-in animations with animation duration
Hide elements
Hide or show header elements after scrolling
Bottom Shadow
Add or remove box shadow effect upon scrolling with color, horizontal, vertical, blur, and spread controls
Custom Icon
Completely customize the mobile menu icon and add transition animation
Split menu
Menus that will split to allow center logo
Screenshots
The options panel is built right in to Elementor Pro’s advanced tab, right where they should be.
