html - モバイル用に DIV の高さをスムーズにアニメーション化するにはどうすればよいですか?

Question

私が取り組んでいるモバイル サイトのアニメーションをいくつか作成しています。現時点では CSS トランジションを使用していますが、ウィジェット (アコーディオン) をプレビューすると、(iPhone で) まったくスムーズにアニメーション化されません。

ハードウェア アクセラレーション デバイスで 2D/3D Transforms(translate) がうまく機能することはわかっています。DIV の高さをスムーズに成長させるために使用できるものはありますか?

サンプルコードは次のとおりです。

<div class="accordion" data-dojo-type="tui.widget.common.Accordion">
    <div class="item">
        <div class="trigger">
              <p>Board options</p></i>
        </div>
        <div class="content">
            <ul class="board">
                <li class="included">Half Board Included</li>
                <li>Self Catering -&pound;220</li>
                <li>All Inclusive +&pound;140</li>
            </ul>
        </div>
    </div>
</div>

どんな助けでも大歓迎です。ありがとう