Whenever I scroll down on my website at Bradly Spicer, the navigation menu extends and ends up falling behind the content.
This is the script I am using:
.menu {
position: relative;
z-index:9999;
}
.post {
background: #fff;
border: 1px solid #ddd;
font-size: 16px;
}
<script>
var height = $('.header').height();
$(window).bind('scroll', function () {
if ($(window).scrollTop() > height) {
$('.menu').addClass('fixed-nav');
$('.wrapper').before($('.menu'));
}
else {
$('.menu').removeClass('fixed-nav');
$('.menu-menu-container').prepend($('.menu'));
}
});
</script>
I have tried setting the z-index as high as possible, but unfortunately it hasn't solved the issue.