Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 30, 2024 at 5:57 pm #1465822
    nTECHgrate

    I’m using an anchor link on one of my sites to scroll to a particular page section. It works as designed, but I hope you can help with a styling issue. The #contact anchor is located at the bottom of the page; however, upon initial page load, the “contact” menu item is highlighted as if it is active.

    I would like the menu item to change to the active color only once it is visible or, say, within 100px of the section.

    Thanks for your help.

    -James

    September 1, 2024 at 9:13 pm #1466009
    Mike

    Hey James,
    Thank you for your patience and the link to your site, I see that you are using two menus on your homepage, the normal menu in a transport header and a submenu.
    Try this css:

    .header_color .main_menu ul:first-child > li.current-menu-item#menu-item-234350 > a, .header_color .main_menu ul:first-child > li.current_page_item#menu-item-234350 > a {
	color: #fff;
}

    Best regards,
    Mike

    September 18, 2024 at 12:55 am #1467246
    nTECHgrate

    Hi Mike,

    This works in that it forces the font color to be white, but now it doesn’t change when I hover over it or when it’s active.

    -James

    September 18, 2024 at 5:27 am #1467264
    nTECHgrate

    I found the problem. I was using a transparent header but had not specified a font color for the transparent menu. As soon as I did, the issue corrected itself.

    You can close the ticket.

    -James

    September 18, 2024 at 9:34 am #1467294
    Rikard

    Hi,

    Thanks for the update. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘anchor link and menu highlighting’ is closed to new replies.