0

jQuery Mobile アコーディオン ウィジェットを jQuery バージョン 1.7.1 および jQueryMobile バージョン 1.1.1 で使用しています。ここのデモのように、アコーディオンを展開したときに固定スペースを占有して、ページの残りの部分が下にスクロールしないようにしたいと思います: http://jqueryui.com/accordion/#default

jQuery の「アコーディオン」オプションを使用してみましたが、異なるようです。現在のように、アコーディオン パネルはコンテンツに応じてサイズが変化するため、アコーディオンの下のコンテンツは常に移動します。

これが私のコードです:

  <div data-role="collapsible-set">
    <div data-role="collapsible">
        <h3>Title 1</h3>
        <p>[content 1: very long]</p>
    </div>
    <div data-role="collapsible">
        <h3>Title 2</h3>
        <p>[content 2: normal length]</p>
    </div>
    <div data-role="collapsible">
        <h3>Title 3</h3>
        <p>[content 3: short]</p>
    </div>
    <div data-role="collapsible">
        <h3>Title 4</h3>
        <p>[content 4: short]</p>
    </div>
</div>

ありがとうございました!

4

1 に答える 1

1

jQuery Ui アコーディオンと jQuery Mobile アコーディオンを混同しないでください。共通点はありません。

jQuery Mobile アコーディオンは、いくつかの css の変更により固定高さを使用するように強制できます。

.ui-collapsible-content {
    height: 50px !important;
    overflow-y:scroll !important;
}

ライブjsFiddle の例: http://jsfiddle.net/Gajotres/YvhLk/

overflow-y:scroll !important; を削除 します。スクロールバーが必要ない場合。

于 2013-02-22T21:13:40.807 に答える