Wie animiere ich ein Div in jQuery von einer festen Höhe zu seiner automatischen Höhe?-CSS-Tutorial-php.cn

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

Patricia Arquette

Freigeben： 2024-12-06 14:19:12

Original

378 Leute haben es durchsucht

How to Animate a Div from a Fixed Height to Its Auto Height in jQuery?

So animieren Sie ein Element auf seine automatische Höhe in jQuery

Beim Versuch, ein

Bei der Umstellung von einer festen Höhe auf die automatische Höhe mithilfe von jQuery können einige Benutzer auf Schwierigkeiten stoßen. Hier ist eine Lösung für diese Herausforderung:

Der bereitgestellte Code:

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

Nach dem Login kopieren

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:

Speichern Sie die aktuelle Höhe:

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

Nach dem Login kopieren

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

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

Nach dem Login kopieren

Holen Sie sich das Auto Höhe:

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

Nach dem Login kopieren

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

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

Nach dem Login kopieren

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!