problemas de altura jQuery DIV

Question

Good day:)

Eu estou usando animado do jQuery () em ambos opacidade e altura, em um div de tamanho fixo.
Tudo funciona muito bem e dândi no firefox, mas no IE8 (com e sem-modo de compatibilidade, então eu estou supondo que ele terá o mesmo comportamento no IE6 e IE7), a animação faz show, mas quando a altura div chegar a 0%, altura ajusta do dIV para a altura do interior texto desse div.
A primeira coisa que imediatamente fez foi conjunto estouro como oculto, mas ainda dá o mesmo comportamento.

Eu estou usando a seguinte função para lentamente alternância altura / opacidade:

function OpacityFadeToggle(e_trigger, e_element, speed)
{
    $(e_trigger).toggle(
        function() {
            $(e_element).animate({ 
                opacity:    0.0,
                height:     "0px"
            }, speed);
        },
        function() {
            $(e_element).animate({
                opacity:    1.0,
                height:     "500px"
            }, speed);
        }
    );
}

$(function() {
    OpacityFadeToggle("a#a2", "div#b1", 1000);
});

Style para o meu div "b1" é o seguinte:

div#b1 {
    color:      #ffffff;
    background-color:   #000000;
    overflow:       hidden;
    width:      600px;
    height:     500px;
    padding:        0px;
    margin:     0px;
    display:        block;
}

Se você preferir quer ver um exemplo vivo, eu configurei temporariamente uma página aqui: clique me !

Qualquer ajuda sobre este assunto é muito apreciado.

Answer 1

E sobre animando-a 1px, então esconder a div após a animação é feito? Além disso, certifique-se de mostrar a div novamente antes de animar de 1px para 500px.

function OpacityFadeToggle(e_trigger, e_element, speed)
{
    $(e_trigger).toggle(
        function() {
                $(e_element).animate({ 
                        opacity:        0.0,
                        height:         "1px"
                }, speed).hide();
        },
        function() {
                $(e_element).show().animate({
                        opacity:        1.0,
                        height:         "500px"
                }, speed);
        }
    );
}

Answer 2

Você pode tentar adicionar uma chamada de retorno ao chamado animado do jQuery, e dentro do hide callback o div mudando o é propriedade de exibição.