mattlawck of StudioPress
8/3/2018 - 4:03 PM

Sticky menu.

Sticky menu.

/* Secondary Navigation
--------------------------------------------- */
 
.nav-secondary {
	background-color: #333;
	display: none;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
}

.nav-secondary .genesis-nav-menu a {
	padding: 20px;
}

.nav-secondary .genesis-nav-menu .sub-menu a {
	padding: 16px 20px;
}

.nav-secondary a:hover,
.nav-secondary .current-menu-item > a,
.nav-secondary .menu-item-home > a,
.nav-secondary .menu-item-home > a:hover {
	color: #fff;
}

.nav-secondary .sub-menu a:hover {
	color: #333;
}
jQuery(function( $ ){
	$(window).scroll(function() {
		var yPos = ( $(window).scrollTop() );
		if(yPos > 200) { // show sticky menu after screen has scrolled down 200px from the top
			$(".nav-secondary").fadeIn();
		} else {
			$(".nav-secondary").fadeOut();
		}
	});
});
<?php
//* Do NOT include the opening php tag shown above. Copy the code shown below.

//* Enqueue sticky menu script
add_action( 'wp_enqueue_scripts', 'sp_enqueue_script' );
function sp_enqueue_script() {
	wp_enqueue_script( 'sample-sticky-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/sticky-menu.js', array( 'jquery' ), '1.0.0' );
}

//* Reposition the secondary navigation menu
remove_action( 'genesis_after_header', 'genesis_do_subnav' );
add_action( 'genesis_before', 'genesis_do_subnav' );