Question

i am creating a single page html5 site based off joefrey mahusay’s template (found here: http://webdesigneraid.com/html5/site-01/) which changes the design behind nav links when a new section is manually scrolled to. in customizing his template, however, i lost that functionality. i’ve been digging through the code to try to figure out what went wrong, but i am very much a novice and i get easily lost in the jquery. the section i believe to be effecting the change is posted below, but i have no idea what went wrong with my changes. can you help?

$(window).scroll(function() {
$inview = $('section:in-viewport header').parent().attr('id');
if ($('a[hash=#' + $inview + ']') !== null) {
    $link = $('a[hash=#' + $inview + ']').parent().attr('id').substr(4);
}

if ($link != $nCurrentActive && scrolling == 1) {
    $nav.removeClass('active');
    offMenu($nCurrentActive);
    $nCurrentActive = $link;
    $('#nav-'+$nCurrentActive).addClass('active');
    onScrollMenu($nCurrentActive);
}
});

Answer 1

I believe you got rid of the header elements.

‘section:in-viewport header’

This is always returning an empty array, since there is no header elements within the sections.