Sticky Header Overlapping Existing Header (last post disappeared?)

[Cr4zyS4m]

Hello,

My apologies if this double posts as I was trying to correct a couple things in the original and now it no longer appears on my end (nor does it show a topic started on my profile).
I am currently creating a Child Theme using Child Theme Configurator and their other plugin for Responsive menu. The Responsive Menu works great and triggers on 767px width or smaller. Naturally I was looking for a Sticky Header for larger screens as well. But to be slightly compressed compared to the existing header (and not a hamburger like mobile).

I came across the following code which worked great but would appear behind the responsive menu for mobile devices..
JS:
<script src="https://gist.github.com/anonymous/c5c8949eade6678c4227a6faceb7ef2b.js"></script>
CSS:

.agct_sticky {
    background-position: left;
    text-align: right;
	background-image: url(images/cropped-logo.png);
    background-repeat: no-repeat;
    display: none;
    position: fixed;
    top: 0;
    border-bottom: 1px solid #2489f5;
    background-color: #000;
    left: 0;
    right: 0;
}

Functions:

//Sticky Header Desktop
add_action('genesis_after_footer','agct_sticky_menu');

function agct_sticky_menu(){
 wp_nav_menu( array(
     'container'       => 'div',
     'container_class' => 'agct_sticky nav-primary',
     'menu_class'      => 'genesis-nav-menu',
     'theme_location'  => 'primary'
 ) );
}

//Call To js
add_action( 'wp_enqueue_scripts', 'agct_sticky_load_scripts' );

function agct_sticky_load_scripts(){
 wp_enqueue_script('sticky_menu', get_stylesheet_directory_uri() . '/js/sticky.js', array( 'jquery' ),'1.0.0',true);

}

After some testing, I was able to add the following to the JS to have the Sticky Header only appear on 768px or larger:
if ( $(window).width() > 768) { //hide on size less than 768

Now the JS appears as:
<script src="https://gist.github.com/anonymous/b843775ed476adb43efd345be88918b9.js"></script>

Finally works and appears properly.

Except

, it won't disappear. Now when scrolling back to the top of the page the Sticky Header remains at the top and will overlap the existing header... I feel there is something I may be missing or not properly adjusted. Any help would be greatly appreciated, thanks in advance!

http://betasite.inplainsight.ca

[Victor Font]

I don't know if we're going to be able to help you. With the plugins you are using, you are working so far outside of the parameters of the Genesis Framework, that the code you posted above doesn't even make sense in the framework's context. You are loading the sticky menu after the footer. That makes no sense.

You might be better off getting the support you need from the developers of the plugins you've chosen. We can help with the Genesis Framework and Studio Press theme s, but 3rd party plugins are beyond what we can help with.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[tarmadillo]

your other post magically appeared at the top of the forum just now. I think something wonky is going on. a bunch of posts from yesterday popped up at the top of the forum.

anyway I tried to answer you here https://www.studiopress.community/topic/sticky-header-overlapping-existing-header/

---

https://armadillowebdesign.com

[Author]

Posts