JQuery - одушевленные/слайд высота: 100%

Question

У меня есть Siple код здесь:

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

Теперь, когда я нажимаю его в качестве первого «тумблер», он просто показывает мгновенно (без анимации), когда Я нажимаю на второй «переключатель», он хорошо скользит вверх.

Есть ли способ сместить его до 100% с помощью этой приятной анимации?

Answer 1

Может быть, вы могли бы сделать что-то вроде:

$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

Answer 2

Мой обходной путь для этого должен был сложить высоты дочерних элементов в DIV, добавив немного для учета рентабельности:

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

Answer 3

Я нашел этот пост в то время как в поисках решения сам и Karim79 имел большое предложение использовать переменную и height() функция.

Для меня я не начинаю с высоты 100%, так как у меня есть заданная высота, определенная в моей таблице стилей. Так что я делаю в функции для расширения, я делаю переменную, у которой есть запрос, чтобы вернуться к определенному элементу, который я хочу развернуть, и изменяет высоту css до 100% и возвращает высоту переменной. Затем я установил css для высоты назад (я полагаю, я мог бы использовать vars, чтобы указать исходную высоту предустановки, а также возможность редактирования css в будущем), а затем запустить анимационную функцию, используя var с высотой.

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'); 
} 

Я также не очень опытный, так что простите небрежное кодирование.