jQuery - animer / glisser à la hauteur: 100%

J'ai un siple code ici:

$('.aktualita_sipky').toggle(function() {
    $(this).parent().find('.aktualita_content').animate({ 
        height: "100%",
      }, 1500 );
}, function() {
    $(this).parent().find('.aktualita_content').animate({ 
        height: "120px",
      }, 1500 );
});

Maintenant quand je clique dessus, comme le premier 'toggle', ça montre juste instantanément (sans animation), lorsque je clique sur le deuxième 'toggle', joliment diapositives.

Est-il un moyen de le faire glisser vers le bas à 100% avec cette belle animation?

source d'informationauteur Mike

  1. 10

    Peut-être que vous pourriez faire quelque chose comme:

    $height = $(window).height();   //returns height of browser viewport
//Or
$height = $(document).height(); //returns height of HTML document
//Or
$height = $(whatever).height();
$('.aktualita_sipky').toggle(function() {
    $(this).parent().find('.aktualita_content').animate({ 
        height: $height + 'px',
      }, 1500 );
}, function() {
    $(this).parent().find('.aktualita_content').animate({ 
        height: $height + 'px',
      }, 1500 );
});

    http://docs.jquery.com/CSS/height

  2. 2

    Ma solution était d'ajouter les hauteurs de l'enfant des éléments de la div, en ajoutant un peu de considération pour les marges:

    function() {
  $('.accordionblock.open').removeClass('open');
  var childrenheight = 0;  $(this).children().each(function() {childrenheight += ($(this).height()*1.2)});
  $(this).animate({height:childrenheight},300).addClass('open');
  }
}
  3. 0

    J'ai trouvé ce post en cherchant une solution moi-même et Karim79 eu la grande idée de l'utilisation d'une variable et la height() fonction.

    Pour moi, je ne commence pas avec la hauteur à 100% depuis que j'ai une hauteur prédéfinie défini dans ma feuille de style. Donc ce que je fais dans la fonction à développer est que je créer une variable qui a une requête de mesures de retour à l'élément spécifique je veux élargir et modifie le css hauteur de 100% et le retour de la hauteur à une variable. Puis j'ai mis le css pour la hauteur du dos (je suppose que je pourrais avoir utilisé à vars dit le préréglage d'origine, la hauteur et la encas-je modifier le css dans le futur), puis exécutez la fonction d'animation à l'aide de la var avec la hauteur. 

    function expandAlbum (){
    var fullHeight = jQuery(this).prev('.albumDropdown').css('height' , '100%').height();
    jQuery(this).prev('.albumDropdown').css('height' , '145px');
    jQuery(this).prev('.albumDropdown').animate({'height' : fullHeight}, 1000, function(){jQuery(this).stop();});
    jQuery(this).html('close');
}

    Je suis également pas très connu donc pardonner bâclée de codage.