Mouseover and mouseout and div with 1px images are separated

I have a div and mouseover function:

$('#mydiv').mouseover(function(){
    $('#otherdiv').show('slow');
});

$('#otherdiv').mouseout(function(){
    $('#otherdiv').hide('slow');
});

but ... #otherdivon the cover #mydivand consists of 5 images 1px, separated from each other. I want to #otherdivdisappear after mouseout, but I am becoming blinking.

How to do it?

+3
source share
2 answers
$('#mydiv').hover(function(){
    $('#otherdiv').stop().show('slow');
}, function(){
    $('#otherdiv').stop().hide('slow');
});

jsBin demo
http://api.jquery.com/hover
http://api.jquery.com/stop

+4
source

Try with stop:

$('#mydiv').mouseover(function(){
    $('#otherdiv').stop().show('slow');
});

$('#otherdiv').mouseout(function(){
    $('#otherdiv').stop().hide('slow');
});
+2
source

All Articles