Streaming live at 10am (PST)

“Current” class for top level dropdown


#1

I have a dropdown component in my nav bar and I’m trying to get the text of the dropdown to stay highlighted when one of the child links has been selected.

I know there are several existing topics on this and I’ve tried to use the solution posted in each (and every) one of them but am not having any luck.

The script below is from the most recent thread I could find on the subject but I have not been able to get it to work.

<script>
var Webflow = Webflow || [];
Webflow.push(function() {
  $('.w-dropdown').each(function() {
    var hasActiveLink = $(this).find('.w--current').length > 0;
    $(this).find('.w-dropdown-toggle').andSelf().toggleClass('dropdown-active', hasActiveLink);
  });
});
</script>

If anyone could give me some advice I would appreciate it.

Thanks,


#2

Ultimately I did get this solution working . I discovered that I had some left over changes from previous attempts that was confusing the issue.

For reference, here is the thread/post where I obtained the solution: