Purpose:
Ensure that the yes
class remains on an element unless it is being added to another.
The code snippet below demonstrates this:
jQuery(function($){
$(window).scroll(function() {
var position = $(this).scrollTop();
if ($('#services').length) {
$('section').each(function() {
var target = $(this).offset().top;
var id = $(this).attr('id');
//nested if statement should be included here
if (position >= target - 79) {
$('.menu-wrap > ul > li > a').removeClass('yes');
$('.menu-wrap > ul > li > a[href*="#' + id + '"]').addClass('yes');
}
});
};
});
})
An additional nested if
statement should be implemented to trigger position >= target
when a menu item link (<a href="#~"/>
) matches the id
of any of the section
elements on the page.
The necessary HTML structure is provided below:
<div class="menu-wrap">
<ul class="nav"><li><a href="#home"/></li><li><a href="second"/></li></ul>
</div>
<section id="home"></section>
<section id="an-id-that-isnt-in-the-menu"></section>
<section id="second"></section>