issues regarding .hover()
I'd like to implement a button and whenever the user moves the mouse over it, an image of a hand (not the cursor pointer but a custom made image) fades in, and when the user moves the mouse out, it fades out.
This is the code I implemented for it:
- $('#wrapper .form_button').hover(
- function() {
- $('#hand').fadeIn('fast');
- },
- function() {
- $('#hand').fadeOut('fast');
- });
When the hand fades in, if the mouse is not over the hand, but over any other part of the button, the behavior is as I desired. The problem with this is when the hand fades in and the mouse is over it. Then this is interpreted as a mouseout from the button, and then the hand continually fades out/in.
What should I do to avoid this?