O'Reilly logo

jQuery UI Cookbook by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Using effects with the button hover state

The button widget utilizes the various states found in the jQuery UI theme framework. For example, when the user hovers over a button widget, this event triggers a handler inside the button widget that applies the ui-state-hover class to the element, changing its appearance. Likewise, when the mouse leaves the widget, a different handler removes that class.

This default functionality of the button widget works fine—it just uses the addClass() and removeClass() jQuery functions to apply the hover class. As the user moves around and considers what he/she wants to do next, the mouse is likely to move in and out of button widgets; this is where we tweak the experience by providing the user with some subtle ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required