アニメーション状態でのdivの高さの同期

Question

3つの列（div要素）で高さを同期させることに問題があります。列の1つがメインコンテンツコンテナです。しかし、私はメインのコンテンツコンテナにアニメーションをいくつか持っているので、アニメーション中およびアニメーション後に、他の2つのカラムと高さを同期させたいと思っています。アニメーションはCSS 3 Webkit-Transitionアニメーションです。そして、アニメーションは列そのものではなく、メインのコンテンツコンテナのコンテンツで発生します。私はテーブルを試して、カラムのdivの高さを100％に設定しました。ことは、列がアニメーションの後に同期されることです。私もJqueryで試してみましたが、そこには問題はありませんでした。

最後に私はクリアしたいです。アニメーション中にそれらを同期させて欲しいです。

誰でも、syncColumnHeight（）;のように、常に関数を呼び出すことなく、ソリューションを提供できます。//メインコンテンツコンテナの列の高さを取得し、それを他の2つの列に挿入します。

UPDATE：table要素で始まる htmlコード：

<table> 
    <tr> 
     <td> 
      <div id='leftColumn'></div>//I want this to sync with the height of the mainContentColumn 
     </td> 
     <td> 
      <div id='mainContentColumn'></div>//All the animation is occuring here 
     </td> 
     <td> 
      <div id='rightColumn'></div>//I want this to sync with the height of the mainContentColumn 
     </td> 
    </tr> 
</table> 

Answer 1

これはあなたのCSSを見ずに解決することは少し難しいですが、私はTDSのに対し、div要素が列スタイリングを持って推測していますそれを必要とする人です。

http://jsfiddle.net/duopixel/weG8P/

ので、コードの中で：

table td { 
    /*Apply column styles such as background-color here*/ 
    -webkit-transition: all 1s ease; 
}