HowTo use sticky menu plugin on Main-header?

There’s some instructions here: https://www.ads-software.com/plugins/sticky-menu-or-anything-on-scroll/#faq

However, if you can share your site’s address and tell me what you’d like to make sticky, I’ll be happy to guide you along.

HI Mark,
my site:
https://www.ehtl.lu
the page where I use the sticky plugin:
https://www.ehtl.lu/offre-scolaire/cuisinier-3

the blue button on the left side in the dark blue section is made sticky with the plugin.
When scrolling down, the transparent MenuBar overlaps the dark blue section and only gets pushed of the screen when the blue section reaches the top of the screen.

I thought I could use the plugin to have a kind of #stop-sticky at the beginning of the blue section and this way push the MenuBar of the screen when blue section comes nearer and nearer to the top of the screen.

Currently I used code to stop showing the MenuBar before blue section reaches the top. but it’s brutal

<script>
jQuery(document).ready(function($){

jQuery(window).scroll(function(){
var SectionTopHeight = jQuery('.et_pb_section_1').offset().top-100,
top_of_screen = $(this).scrollTop(),
bottom_of_screen = $(this).scrollTop() + window.innerHeight;
if(top_of_screen > SectionTopHeight){
jQuery('.et_fixed_nav #main-header, .et_fixed_nav #top-header').css('position', 'absolute');
}else{
jQuery('.et_fixed_nav #main-header, .et_fixed_nav #top-header').css('position', 'fixed');
}
});
});

Thank you for your help

I’m sorry, I’m not really sure what you’re trying to do.

I can’t help with custom code, but if there are any issues with the plugin itself or how it works (without additional code), please let me know and I might be able to help with that.

Forget about the code,

My question is, how could I apply your plugin to the Primary Menu Bar in Divi?

On this page: https://www.ehtl.lu/manifestations/ it’s the white Menu on Top,

I want to have the white menu sticky when scrolling , this means the blue section called “manifestations” should be coverd by the menu when scrolling.

When the next section (white with text) reaches the sticky menu, sticky should stop and the menu should be pushed out of the screen by the white text section.

This is what I have basicaly done whit the code, but with the code the menu is not pushed out of the screen but it disapears at one exact moment, by the way this code applies to the whole site and I do not want that, your plugin would be better because it may be applied to one single page.

If this is not clear , I would try to explain better, but english is not my language, I could also write in german or french.

Thanks for your plugin and your help.

could someone tell me how to use the plugin for the primary menu in Divi Theme?

regards
biege

It doesn’t matter what theme you use or pagebuilder — for my plugin, it only matters what the result is and how your site appears in a browser; though, you have to make sure that any other functionality that makes the element sticky (within Divi, or any other plugin) is turned off.

For your page, to make the white header sticky with my plugin, you will need to set #main-header as the sticky element.

To make the white text push it back up, you will need to give that block a unique class or ID (probably in Divi) and you can then use that as the “push-up” element in my plugin.

• This reply was modified 5 years, 7 months ago by Senff.