So, my navigation bar starts with a transparent background, but I wanted it to change to a different background color when a user scrolls down.
I found a solution in this question: Changing nav-bar color after scrolling?
My current code now looks like this:
$(document).ready(function(){
var scroll_start = 0;
var startchange = $('#startchange');
var offset = startchange.offset();
if (startchange.length){
$(document).scroll(function() {
scroll_start = $(this).scrollTop();
if(scroll_start > offset.top) {
$(".navbar-fixed-top").css({'background-color':'#24363d',
'opacity': '0.3'});
} else {
$('.navbar-fixed-top').css({'background-color':'transparent'});
}
});
}
});
When I scroll down, everything works fine, the background color and opacity change accordingly. But when I scroll back to the top, the style remains. I want it to revert back to the default styling with no background color.
Thank you