Question

我在html页面上使用div下面的div和一个表（在容器div内）。第一个div是手风琴

  $( function() {
$( "#resizeableDiv" ).accordion({
  collapsible: true,
  active:false'
});
 } );

点击标题后，div会折叠或展开。下面的表格卡在折叠/展开的div下面。

我想要做的是，当第一个div折叠时，我希望表容器div高度增加，并且当它扩展时减小，所以两个元素的大小保持不变。

我在论坛上做了一些研究，尝试通过在heightion（{}）或function（{}）中放置高度指令来自己做，但只要我是jQuery的新手，它就不起作用了。一点都不。

我已经坚持了一段时间，所以欢迎任何帮助！：）

Answer 1

您可以绑定到Activate event

例如，以下是如何使用activate事件滚动到顶部：

   $("#accordion").accordion({
  active: false,
  collapsible: true,
  heightStyle: "content",
  activate: function (event, ui) {
     if (ui.newHeader.length > 0) {
        var offset = ui.newHeader[0].offsetTop - 20;
        var bodyOffset = $(document).scrollTop();
        if (bodyOffset > offset) {
           $('body,html').animate({
              scrollTop: offset
           });
        }
     }
  }

Answer 2

对于那些感兴趣的人，这是我实施的解决方案。 hcham1答案也很有效。

$( function() { 
$( "#myDiv" ).accordion({
  collapsible: true,
  active:false,
  activate: function(event, ui) {
    if(ui.newHeader.text()!="") //Expanding (will be empty when the tab is collapsed
        $("#ScrollBody").animate({
        height: '-=420px'
        }, 1000);
    else //Collapsing
        $("#ScrollBody").animate({
        height: '+=420px'
        }, 1000);
}
});
});

调整jQuery手风琴事件的其他元素

2 个答案: