jQueryアコーディオンイベントの他の要素のサイズを変更する

Question

私は、HTMLページのdivの下にdivとtable（コンテナdivの内側）を使用しています。ヘッダをクリック到達したら 第一のdivはアコーディオン

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

で、divが崩壊または拡大します。下の表は折りたたまれた/展開されたdivの下に固定されています。

私がしたいのは、最初のdivが折りたたまれたときにテーブルコンテナのdivの高さを大きくし、展開するときに縮小するので、両方の要素のサイズが変わらないようにすることです。

私はフォーラムでいくつかの研究を行い、アコーディオン（{}）や関数（{}）の内側に高さの指示を入れて自分自身でしようとしましたが、jQueryを初めて使っている限り、すべて。

私はしばらくそれに固執しているので、どんな助けも歓迎されるでしょう！ :)あなたがここに例えばActivate event

に結合することができ

Answer 1

、ここで私が実装ソリューションです。 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); 
} 
}); 
}); 

Answer 2

はあなたがトップにスクロールする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 
      }); 
     } 
    } 
    }