One Page Navigation and Links

[trunorth]

Hello,

We are having some trouble with a few things and trying to accomplish two things.

We have set the homepage up with functionality that highlights the NAV when the section is visible. For instance, when scrolling to “FIRM”, the “FIRM” Navigation link in the header goes RED.

Issue- It seems delayed and does not maybe activate at the proper time. We have adjusted padding as much as necessary to make it still visually appealing, but are not able to figure out what else could be causing this? This is the code we are using:

 /**
 * This part handles the highlighting functionality.
 * We use the scroll functionality again, some array creation and 
 * manipulation, class adding and class removing, and conditional testing
 */
var aChildren = $("nav li").children(); // find the a children of the list items

var aArray = []; // create the empty aArray
for (var i=0; i < aChildren.length; i++) {    
    var aChild = aChildren[i];
    var ahref = $(aChild).attr('href');
    aArray.push(ahref);
    //alert(ahref);
} // this for loop fills the aArray with attribute href values

$(window).scroll(function(){
    var windowPos = $(window).scrollTop(); // get the offset of the window from the top of page
    var windowHeight = $(window).height(); // get the height of the window
    var docHeight = $(document).height();

    for (var i=0; i < aArray.length; i++) {
        var theID = aArray[i];
        var divPos = $(theID).offset().top;// get the offset of the div from the top of page
        divPos = divPos - 190; // fix for header hight and padding. In our case 90px+45px
        var divHeight = $(theID).height(); // get the height of the div in question
        divHeight = divHeight +90;// correction for our previous fix so that end of div is calculated properly. This is height of fixed header
        if (windowPos >= divPos && windowPos < (divPos + divHeight)) {
            $("a[href='" + theID + "']").parent().addClass("current-menu-item");
        } else {
            $("a[href='" + theID + "']").parent().removeClass("current-menu-item");
        }
    }
});

});

That code was found on these Forums.

I am sending a secure note with login.

Thanks!!

[marc_a]

Hi Del,

Thanks for reaching out.

I understand that you might have copied some code here in the forum but all custom code, even if you got it here in the forum, is the user’s responsibility to maintain.

If you’re not sure how to fix it, please consult with a developer or you can avail One where we can answer questions outside of the features of our theme.

Hope that helps and thank you for understanding.