You might want to look into using the hoverIntent plugin ...
http://jquery.com/plugins/project/hoverIntent
On Nov 24, 9:46 pm, krcko <[EMAIL PROTECTED]> wrote:
> Hi to all, i'm having problems with fade in/out animation. I have
> buttons and i want to make hover fade-in effect.
>
> this is html:
>
> <div class="button">
> <div class="button-base"></div>
> <div class="button-hover"></div>
> <a href="#">Top rated</a>
> </div>
>
> <div class="button">
> <div class="button-base"></div>
> <div class="button-hover"></div>
> <a href="#">Groups</a>
> </div>
>
> at the beginning button-hover is hidden, and i want to make it fade-in
> when button is hovered, this is script i use:
>
> $(function()
> {
> $('.button').each(function()
> {
> $(this).hover
> (
> function()
> {
> $('.button-hover', this).fadeIn('fast');
> },
>
> function()
> {
> $('.button-hover', this).fadeOut('normal');
> }
> );
> });
>
> });
>
> and it works ok, but when i move mouse hover and out the button i.e.
> 15 times the script will 'remember' that and it will flash button 15
> times! i don't want this.
>
> i've tried to add flag to each button $('.button').attr('animating',
> 'no') and to check it before doing any animations, if the flag state
> is "yes" i return, if not i do animation, and i was setting this flag
> before fadeIn and fadeOut and reseting it in callback function for
> each animation... but it doesn't works...
>
> i've tried with .stop() function but had no luck either...
