Please help.
Im trying to make a function that fades out a span background and fades another in. but it dosnt seem to work a 100%. When i do a mouseover on one of the links all the span containers fades in?
$('#leftcol-front a').append('<span></span>');
$('#leftcol-front a').hover(function() {
var $fade = $(this);
$fade.addClass('onmouseover');
$('#leftcol-front a.onmouseover span').stop().fadeTo(700, 0), fadeIn()
function fadeIn() {
$fade.removeClass('onmouseover');
$fade.addClass('fadein');
$('#leftcol-front a.fadein span').css({ 'opacity': 0 });
$('#leftcol-front a.fadein span').stop().fadeTo(700, 1);
}
},
function () {
$('#leftcol-front a.fadein span').stop().fadeTo(700, 0), onMouseOut()
$fade.removeClass('fadein');
function onMouseOut() {
$('#leftcol-front a span').css({ 'opacity': 1 });
}
}
);