i started with this menu and the level 1 primary link bg bounces in but I would like it to fade in
original code
Code:
$(document).ready(function(){
if ($.browser.msie && parseInt($.browser.version) < 7){
$('#menu ul.menu li').hover(
function(){ $(this).addClass('sfhover'); },
function(){ $(this).removeClass('sfhover'); }
);
}
$('#menu ul.menu > li').children('a').children('span').after("<span class=\"bg\"> </span>");
//---bouncing bg
$('#menu ul.menu > li').hover(
function(){
//---IE7 width bugfix
$(this).find('span.bg').css("width", $(this).width());
//---end of IE7 width bugfix
$(this).find('span.bg').stop(true,true).animate({
"marginTop" : "-30px"
}, 500, "bounceout");
},
function(){
$(this).find('span.bg').stop(true,true).animate({
"marginTop" : "0"
}, 500, "bounceout");
}
);
modified code, what i'm trying
Code:
$(document).ready(function(){
if ($.browser.msie && parseInt($.browser.version) < 7){
$('#menu ul.menu li').hover(
function(){ $(this).addClass('sfhover'); },
function(){ $(this).removeClass('sfhover'); }
);
}
$('#menu ul.menu > li').children('a').children('span').after("<span class=\"bg\"> </span>");
//---bouncing bg
$('#menu ul.menu > li').hover(
function(){
//---IE7 width bugfix
$(this).find('span.bg').css("width", $(this).width());
//---end of IE7 width bugfix
$(this).find('span.bg').fadeIn(500);
},
function(){
$(this).find('span.bg').fadeIn(500);
}
);
also tried this
Code:
$(document).ready(function(){
$("ELEMENT HERE").fadeTo("slow", 0.3);
$("ELEMENT HERE").hover(function(){
$(this).fadeTo("slow", 1.0);
},function(){
$(this).fadeTo("slow", 0.3);
});
});