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

Question

我在html页面的div下面使用了一个div和一个表(在容器div内)。第一个div是手风琴

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

单击页眉后，div将折叠或展开。下面的表格仍然卡在折叠/展开的div下面。

我想做的是，我希望表格容器div的高度在第一个div折叠时增加，并在展开时减小，因此两个元素的大小保持不变。

我在论坛上做了一些研究，试着自己把高度指令放在accordion({})或function({})里面，但只要我是jQuery新手，它根本不起作用。

我已经被这个问题困扰了一段时间，所以欢迎任何帮助!:)

Answer 1

可以绑定到Activate事件

例如，下面是如何使用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);
}
});
});