---
title: "How to Hide Header Menu in Scroll Down and Show on Scroll Up | Elementor Sticky Headers [Video Tutorial]"
url: https://theplusaddons.com/docs/hide-header-menu-scroll-show-scroll-up-elementor-sticky-headers/
date: 2023-07-05
modified: 2026-04-11
author: "Aditya Sharma"
description: "https://www.youtube.com/watch?v=w85PCKvM1uo Video Duration: 01 : 22 Video Overview We will see how to Hide Elementor Header Menu when you scroll down and show again when scroll up. This will automatically..."
image: https://theplusaddons.com/wp-content/uploads/2023/07/maxresdefault-42-1024x576.jpg
word_count: 168
---

# How to Hide Header Menu in Scroll Down and Show on Scroll Up | Elementor Sticky Headers [Video Tutorial]

## Key Takeaways

- Elementor Sticky Header hides the complete Header when scrolling down and shows it again when scrolling up.
- The Elementor Sticky Header includes 8 styles, allowing changes to color, logo, and font size.
- The addon provides effects like Transparent Sticky Header and Shrinking Header Effect.

https://www.youtube.com/watch?v=w85PCKvM1uo

##### Video Duration: 01 : 22

## Video Overview

We will see how to Hide Elementor Header Menu when you scroll down and show again when scroll up. This will automatically hide the complete Header when scrolling down, and make the header visible again when we scroll upwards.

Our Elementor Sticky Header comes with 8 more styles, you can change colour logo or font size as well, when the Header is sticky.

▶ Widgets Used - [https://theplusaddons.com/elementor-builder/header-builder/](https://theplusaddons.com/elementor-builder/header-builder/)

You can Create 8 More Header Effects for Elementor
▶️ Watch Full Video - [https://youtu.be/FfXpQOhWnfM](https://youtu.be/FfXpQOhWnfM)

Header Style you can achieve using this addon
✅ Sticky Elementor Header Effect
✅ Sticky Menu with on scroll Colour Change Effect
✅ Transparent Sticky Header Effect
✅ Sticky Glass Effect/Blurry Header Effects
✅ Hide Header on Scroll Down Effect
✅ Change Header Height on Scroll/Shrinking Header Effect
✅ Change Header Menu Logo on Scroll
✅ Change Header Logo On Hover

▶ Get 120+ Powerful Widgets for Elementor - [https://theplusaddons.com/pricing/](https://theplusaddons.com/pricing/)
▶ Nexter Theme Builder - [https://nexterwp.com/](https://nexterwp.com/)
USE CODE ' YOUTUBE10 ' TO ENJOY EXTRA 10% DISCOUNT

[Get The Plus Addons for Elementor](https://theplusaddons.com/pricing/)

[View 120+ Elementor Widgets Demo](https://theplusaddons.com/elementor-widgets/)

## Frequently Asked Questions

**Q: What should I do if the header menu doesn't hide when scrolling down?**
A: If the header menu isn't hiding on scroll down, check the settings in the Elementor Sticky Header options. Ensure that the 'Hide Header on Scroll Down' effect is enabled. This feature allows the complete header to disappear when you scroll down, enhancing user experience by maximizing screen space.

**Q: Can I use the hide/show header feature for mobile devices?**
A: The hide/show header feature works on mobile devices as well, allowing for a responsive design. This is particularly useful for mobile users, as it provides more screen real estate for content while still keeping navigation accessible when scrolling up.

**Q: What is the best practice for using the sticky header effect?**
A: A best practice for using the sticky header effect is to ensure that the header remains visually consistent with your site's branding. The Plus Addons for Elementor allows you to change the header's color, logo, and font size when it becomes sticky, which can help maintain brand identity while providing a functional navigation experience.

**Q: Are there any limitations to the sticky header feature?**
A: One limitation of the sticky header feature is that it only works with Elementor and does not support other page builders like Gutenberg or Divi. This means if you're using a different builder, you won't be able to implement these specific sticky header effects.