How to realize mouse hover and switch class properties by jQuery

This article is about how jQuery can hover and toggle class properties. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Mouse over (hover) toggles class properties

If you want to change the effect of a clickable element when the user hovers over it, the following code adds the class attribute when it hovers over the element, and automatically cancels the class attribute when the user leaves the mouse:

$('.btn') .hover (function () {$(this) .addClass ('hover');}, function () {$(this) .removeClass (' hover');})

You just need to add the necessary CSS code. If you want cleaner code, you can use the toggleClass method:

$('.btn') .hover (function () {$(this) .toggleClass ('hover');})

Note: using CSS directly to achieve this effect may be a better solution, but you still need to know this method.

Thank you for reading! On "jQuery how to achieve mouse hover switch class properties" this article is shared here, I hope the above content can be of some help to you, so that you can learn more knowledge, if you think the article is good, you can share it out for more people to see it!