Comment animer un div d'une hauteur fixe à sa hauteur automatique dans jQuery ?

Comment animer un élément à sa hauteur automatique dans jQuery

Lorsque vous essayez d'animer un élément

d'une hauteur fixe à sa hauteur automatique en utilisant jQuery, certains utilisateurs peuvent rencontrer des difficultés. Voici une solution à ce défi :

Le code fourni :

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

rencontre des problèmes car les navigateurs n'animeront pas un changement de hauteur d'une valeur fixe à "auto".

Pour réaliser l'animation souhaitée, suivez ces étapes :

1. Enregistrez l'animation actuelle hauteur :

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

2. Réglez temporairement la hauteur sur « auto » :

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

3. Obtenez l'auto hauteur :

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

4. Restaurer la hauteur actuelle et animer à la hauteur automatique :

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

Ceci La solution fonctionne car elle récupère d'abord la hauteur actuelle, permettant au navigateur de déterminer sa hauteur finale lorsqu'il est défini sur "auto".

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

jquery auto using this animation

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn