Streaming live at 10am (PST)

Current class on on the actual dropdown toggle button in navbar?


#1

Hi

Not sure if it's possible or I'm doing something wrong, but here it goes: When I use a dropdown in the navbar, is there a way to set a "current style" on the dropdown button itself, not just on the selected buttons in the dropdown list? When used in the navbar, after the user have clicked on a button in the dropdown list and the list is closed, it would be great if the dropdown button could indicate that "a-button-in-this-dropdown-list-is-selected"

BR
Christoffer


How to get to "current" state of dropdown toggle?
Current class on on the actual dropdown toggle - revisited
#2

You have to use custom code for this.

<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>

http://sandbox-903b9c.webflow.io/current-class-on-dropdown-containing-current-link

https://preview.webflow.com/preview/sandbox-903b9c?preview=2a77d4d5446ddad097abb9bf8603288b


Also, feel free to contact me for further code help and/or customization of third-party plugins


#3

Thanks for your reply @samliew, I'm not in the office next week, but will try this as soon as I'm back :+1:

BR
Christoffer


#4

Hi again @samliew

So, I have added your code to the custom code area... and it flip'in worked! :smiley: Thanks for your time!


How to get to "current" state of dropdown toggle?
#5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.