Change Sticky Header Color When Scrolling - (Slide In MegaMenu variation)

This is a variation on our previous video "Create a Slide In MegaMenu - DiviMenus SHOW (1)"
   • Create a Slide In MegaMenu - DiviMenu...  

So please watch the video above to better understand what we are going to do:

1. Go to Section - Advanced Tab - CSS ID, and paste: dd-header
2. Go to Section - Advanced Tab - Position - Set “Default”, and Z-Index: “999”
3. Go to Section - Advanced Tab - Scroll Effects, and select “Stick to Top”
4. Save, Exit from Theme Builder, and Enter again.
5. Go to Section - Content Tab - Background - Sticky Icon, and choose a color.
6. Insert a CODE module underneath the DiviMenu, and paste this code below.

(As shown in the video, please note that you must add before this code the word "script" in angle brackets, and also the word "/script" at the end of the code.)

jQuery(function($){
$('#et-main-area').css('margin-top', -$('#dd-header').height());
});

7. Finally, Go to Section 2 (which actually contains the Megamenu) - Advanced Tab - Position - Set “Default”, and Z-Index: “998”



That's it! Hope it helps!

________

⚠️ WARNING: Please note that this video was recorded using "DiviMenus" 1.2, and we recently released "DiviMenus" 2.0 which includes many improvements. If you download this layout from DonDivi - Your Account, you will see that we have replaced the top Section that contained 2 different "DiviMenus" modules with only 1 "DiviMenus Flex" module.

Changelog:
https://dondivi.com/changelog/

________


🧡 DiviMenus:
A powerful menu builder that brings the coolest designs and popups to Divi!

https://dondivi.com/divimenus

________

💜 DonDivi:
We create premium tools for improving your creativity and simplifying the way to design stunning websites with Divi.