How do keep mouseenter from infinitely retriggering an action?
I want an action to fire ONCE on mouseenter. How do I keep the action from repeating ad nauseum?
It's a <td id="cap"> with an image. An alternate <td id="capB"> placed on top of it (via z-index) is supposed to momentarily become display:inline and show its image, then goes display:none again and the original <td id="cap"> becomes visible again until mouse goes out and re-enters.
But the problem is, my script keeps refreshing and thinks it's repeatedly a genuine mouseenter, so the whole thing triggers endlessly.
How to I stop the action's repeat unless a real "user made" mouseleave and mouseenter occurs? I've tried using .stop( ) but no matter which two boolean parameters I enter for it, it doesn't help.
Thanks for any assistance in advance... I much appreciate it!
My current code looks like this. This causes non-stop flashing of the alt. td element.
$('#cap').bind('mouseenter', function( ) {
$('#cap').hide(1,function( ) {
$('#capB').show(2, function( ) {
$('#capB').hide(1,function( ) {
$('#cap').show(function( ) {
$('#cap').blur(function( ) {
// I thought .blur( ) might be the answer, but no.
});
});
});
});
});
});