0

jquerysアコーディオン機能でアニメーション化された順序付けられていないリストが、画面の幅と高さ全体を占めて、ネイティブモバイルアプリケーションの感触を与えたいと思います。リスト要素の 1 つが常にドロップダウンされます。

ここにjsfiddleがあります

http://jsfiddle.net/SteveRobertson/Rm66M/5/

CSSを厳密に操作することで、これをどのように行うことができますか?

アニメーションは id = celebs, #celebs を追加した div レイヤーに対して行われます

    body, celebs, and html styling to remove all margins and padding

ビューの高さ全体を正確に占めるにはどうすればよいですか?

4

1 に答える 1

1

あなたが探している感触についてはよくわかりませんが、セクションがウィンドウの高さの 100% を占めるようにしたい場合は、次のようにします。

html, body, #celebs, #accordion, li.active {
    height: 100%;
}

これにより、アクティブな li がウィンドウの高さいっぱいになることに注意してください。「他の閉じたセクションを表示した後に残っている垂直方向のスペースをすべて占有する」ようにしたい場合は、少し計算する必要があります。(ウィンドウの高さ - 他の Li の高さを合わせたもの = アクティブな Li のサイズを変更するために残ったもの)。

heightStyle: "fill"必要に応じて、jQueryUI のアコーディオンを( http://jqueryui.com/accordion/#fillspace )で使用することもできます。

于 2013-03-28T12:53:06.297 に答える