jquery - 高度样式 : "fill" is not working for accordion in Jquery

标签 jquery css jquery-ui jquery-ui-accordion

enter image description here - 随着容器尺寸的变化,我可以自定义
#backlogEpic 中定义的宽度即 526px 但高度不是
定制。为了填充其容器分配的垂直空间,我 已将 heightStyle 选项设置为“填充”,但仍然不起作用
出去。它采用“自动”的默认高度。我如何自定义
我的高度。如果您在图片中看到,展开面板将超出容器范围。

     html:-  
        <div id="backlogEpic" class="ui-widget-content">
        <div id="backlogAccordion">  
        <--- accordian code---->   
        </div> 
        </div>

    css :-  
      #backlogEpic{  
      padding: 10px;    height: 200px;    width: 526px;    right: 25px;    }  

   javascript:-  


    $(function() {

      $( "#backlogEpic" ).resizable({
         minHeight:140,
          minWidth: 150,
          resize: function() {
              $( "#backlogAccordion" ).accordion( "refresh" );
          }
      });
      $( "#backlogAccordion" ).accordion({
          heightStyle: "fill"
      });    });

最佳答案

我和你遇到了同样的问题。我的网站使用的是 jQuery 1.9.1 和 jQueryUI 1.10.2。我所有的努力都在父 div 上,但文档或讨论中的任何内容都没有奏效。昨天我发现了SO话题jquery 1.9 accordion height issue其中 Mottie 建议修改每个 Accordion 面板而不是父面板的 CSS:

#accordion .ui-accordion-content {    
    max-height: 400px;
    overflow-y: auto;
}

在我从昨天开始进行的有限测试中,这解决了 Accordion 溢出其容器的问题。

关于jquery - 高度样式 : "fill" is not working for accordion in Jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13567171/

相关文章:

javascript - 实现表格行的向下滑动

javascript - 在前置的 img 标签内仅显示左下四分之一

javascript - 如何防止 jquery 选项卡在刷新时默认为第一个选项卡?

点击时jQuery动画背景颜色

jquery - Uncaught ReferenceError : $ is not defined (anonymous function)

Javascript 'Node' 在 IE8 及以下未定义

javascript - 如何有效地创建 100 个切换图像按钮?

css - 使用 rvest 从 CSS 中抓取标题属性

css - 使用 CSS 转换旋转表格标题文本

jQuery 在显示/隐藏之间缓动动画