I need to remove and add a class at a specific point on a page but that point is different on each page so "if (scroll >= 300)" doesn't work for all pages. Is there a way to do this based on scroll to a section id?
$(function() {
//caches a jQuery object containing the content element
var content = $(".isi-fixed");
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 300) {
content.removeClass('isi-fixed').addClass("isi");
} else {
content.removeClass("isi").addClass('isi-fixed');
}
});
My css is
.isi-fixed {
width: 100%;
height: 20%;
bottom: 0px;
right: 0px;
padding: 50px;
opacity: 0.5;
overflow-y: scroll;
visibility: visible;
display: block;
z-index: 500 !important;
position: fixed;
background-color: #E7E7E7;
}
and
.isi {
width: 100%;
padding: 50px;
visibility: visible;
position: relative;
background-color: #E7E7E7;
}