[jQuery] fadein/fadeout conflicting
I'm brand new to jQuery. And, I'm wanting to make something fadeOut
when I hover or mouseover and fadeIn when I mouseout. I tried the two
methods below. But, when I leave the mouse cursor positioned over the
element, I get an unwanted blink effect. It seems that when the
fadeOut() ends, it triggers the next method. I wouldn't expect that.
I figure this is probably jQuery 101. But, I couldn't find the answer
in the archives.
Any suggestions?
TIA,
backdoc
<script type="text/javascript">
$(document).ready(function() {
$("a").click(function(e) {
e.preventDefault;
//alert("Hello world!");
});
$("a").hover(
function(e) {
$(this).css("background", "white");
$(this).fadeOut(500);
},
function(e) {
$(this).css("background", "black");
$(this).fadeIn(100);
});
/*
$("a").mouseover(
function(e) {
//alert(this.id);
$(this).css("background", "yellow");
$(this).fadeOut(500);
});
$("a").mouseout(
function(e) {
$(this).css("background", "black");
$(this).fadeIn(100);
});
*/
});
</script>