jquery show hide panel height issue

Question

JsFiddle

我有这个jquery代码从左到右显示和隐藏面板。我的问题是height: 100%无效。当我调整浏览器大小时，面板应该触摸浏览器底部。但它不适合bottom: 0px;。

$(function(){
    $('.slider-arrow').click(function(){
        if($(this).hasClass('show')){
        $( ".slider-arrow, .panel" ).animate({
          left: "+=295"
          }, 700, function() {
            // Animation complete.
          });
          $(this).html('Hide').removeClass('show').addClass('hide');
        }
        else {      
        $( ".slider-arrow, .panel" ).animate({
          left: "-=295"
          }, 700, function() {
            // Animation complete.
          });
          $(this).html('Show').removeClass('hide').addClass('show');    
        }
    });

});

Answer 1

要将DIV的高度设置为100％，您还应将body和html的高度设置为100％，如下所示：http://jsfiddle.net/veritas87/EL2RK/7/

html, body { 
 height:100%;   
}

Answer 2

<强> CSS

html, body, .panel, .contentHolder{height:100%;}

<强> DEMO

Answer 3

身高：*有些身高* px;在你的.pannel CSS中

以前的例子中有一个带有最小高度的JSfiddle：）

http://jsfiddle.net/EL2RK/12/

.panel{
Min-height:121px;
}