Wie animiere ich ein Div in jQuery von einer festen Höhe zu seiner automatischen Höhe?

Der bereitgestellte Code:

$("div:first").click(function(){
  $("#first").animate({
    height: "auto"
  }, 1000 );
});

stößt auf Probleme, da Browser eine Änderung der Höhe von einem festen Wert auf „Auto“ nicht animieren.

Um die gewünschte Animation zu erzielen, befolgen Sie diese Schritte:

1. Speichern Sie die aktuelle Höhe:

var curHeight = $('#first').height();

2. Stellen Sie die Höhe vorübergehend auf „Auto“:

$('#first').css('height', 'auto');

3. Holen Sie sich das Auto Höhe:

var autoHeight = $('#first').height();

4. Stellen Sie die aktuelle Höhe wieder her und animieren Sie auf die automatische Höhe:

$('#first').height(curHeight).animate({height: autoHeight}, 1000);

Dies Die Lösung funktioniert, weil sie zunächst die aktuelle Höhe abruft und es dem Browser ermöglicht, die endgültige Höhe zu bestimmen, wenn sie auf „Auto“ eingestellt ist.

Das obige ist der detaillierte Inhalt vonWie animiere ich ein Div in jQuery von einer festen Höhe zu seiner automatischen Höhe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!