Similar to other effects methods, you can use a toggle method instead of chaining the
.removeClass() methods together.
.toggleClass() method adds a class if an element does not already have it, and removes it if an element does already have it. Its syntax looks like:
In the example above:
.toggleClass()is called on
.toggleClass()will add the
.example-classelements if they do not have it already.
.toggleClass()will remove the
.example-classelements if they do have it already.
In main.js we changed the mouse enter event to a click event so you can see the changes that are caused by the
.toggleClass() method below.
.toggleClass() to add or remove the
hide class from the navigation menu element.
.toggleClass() to add and remove the
button-active class from the menu button.