[jQuery] combine slide and fade
Hei there, i want to combine the slideUp with a fadeOut and the slideDown with a fadeIn. So while the sliding takes place the effect fade should fire:
function toggleContent(){
if(!$(this).find(".imageBox").hasClass("active")){
// animate mit fade in
var toHide=$(".contentList .active"),
toShow=$(this).find(".imageBox"),
hideHeight = toHide.height(),
showHeight = toShow.height(),
difference = showHeight / hideHeight;
toShow.addClass("active").css({ height: 0, overflow: 'hidden'}).fadeIn(700);
toHide.removeClass("active").animate({height:"hide", opacity:'hide'},{
step: function(now) {
//console.log(now/toHide.height())
var current = (hideHeight - now) * difference;
if ($.browser.msie || $.browser.opera) {
current = Math.ceil(current);
}
toShow.height( current );
//toHide.css("opacity", 1-now/toHide.height()) // this works but sucks to much recources
},
duration: 500,
easing: "swing",
complete: function() {
}
});
}
}
my problem is now: the fadeIn of toShow works, but i don't know how to fadeOut the toHide
somebody has a clue or a workaround?
cheers chris