jQuery DIV Höhe Fragen

Question

Guter Tag:)

Ich bin mit jQuery animieren () auf beide Opazität und Höhe, auf einer feste Größe div.
 Es funktioniert alles schön und gut in Firefox, aber in IE8 (mit und ohne Kompatibilitätsmodus, so dass ich davon aus, es wird das gleiche Verhalten in IE6 und IE7 hat), die Animation Show tut, aber wenn die div Höhe 0% erreicht, die Höhe passt die div der Höhe des Textes innerhalb des div.
Das erste, was ich wurde sofort Überlauf tat gesetzt versteckt, aber es gibt immer noch das gleiche Verhalten.

Ich verwende die folgende Funktion zu langsam Höhe / Undurchsichtigkeit wechseln:

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 für meine "b1" div ist die folgende:

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

Wenn Sie lieber würde wollen ein anschauliches Beispiel sehen, habe ich vorübergehend eine Seite hier ein: klicken !

Jede Hilfe zu diesem Thema wird sehr geschätzt.

Answer 1

Was ist Animieren es 1px, dann versteckt das div, nachdem die Animation fertig ist? Stellen Sie außerdem sicher, dass die div wieder zeigen, bevor sie von 1px zu 500px Animieren.

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

Sie kann versuchen, einen Rückruf zu jQuery belebten Gespräch hinzugefügt wird, und innerhalb des Rückrufs, um die div ausblenden, indem es Anzeigeeigenschaften zu ändern.