This is JS that controls the active link color on WP submenus that have both direct page links and anchor links on the same drop-down. It prevents all the anchor link menu items on an active page from being highlighted, and it highlights the correct anchor link on a submenu when navigating to it from another page.
<script>
(function ($) {
$(document).ready(function () {
var menu_items_links = $(".nav li a");
menu_items_links.each(function () {
if ($(this).is('[href*="#"]')) {
$(this).parent().removeClass('current-menu-item current-menu-ancestor');
$(this).click(function () {
var current_index = $(this).parent().index(),
parent_element = $(this).closest('ul');
parent_element.find('li').not(':eq(' + current_index + ')').removeClass('current-menu-item current-menu-ancestor');
$(this).parent().addClass('current-menu-item current-menu-ancestor');
})
}
})
});
})(jQuery);
</script>
/* Set all submenu colors to inactive website color */
#top-menu .sub-menu li a,
.et-fixed-header #top-menu .sub-menu li.current-menu-item>a {
color: gray!important;
}