0

ページにいくつかのhtmlがあります。フッターでは、Today ボタンと Refresh ボタンをコントロール グループと同じ行に配置し、ボタンを左右に配置し、コントロール グループを中央に配置します。jQuery Mobile でこれを行う簡単な方法はありますか?

    <div data-role="page" id="display_appointments">
        <div data-theme="a" data-role="header">
            <a href="#" data-icon="delete">Menu</a>
            <h3>
                Appointments
            </h3>
            <a href="#" data-icon="delete">Add</a>
        </div>

        <div data-role="content">
            Appointments here
        </div>

        <div data-theme="a" data-role="footer" data-position="fixed">
            <a href="#display_appointments" data-role="button">Today</a>
            <div data-role="controlgroup" data-type="horizontal">
                <a href="#display_appointments" data-role="button">Day</a>
                <a href="#display_appointments_list" data-role="button">List</a>
                <a href="#display_appointments_month" data-role="button">Month</a>
            </div>
            <a href="#display_appointments" data-role="button">Refresh</a>
        </div>
</div>
4

2 に答える 2

1

これがあなたのための実例です：http://jsfiddle.net/Gajotres/MADn7/

それを機能させるには、jQuery Mobile プラグインが必要です: http://jeromeetienne.github.com/jquery-mobile-960/。これは純粋な css プラグインであり、デフォルトの jQM グリッドよりもはるかに柔軟なグリッドに使用されます。

もう 1 つのことは、controlgroup を水平中央の div でラップする必要があることです。例ですべてを見つけることができます。

<fieldset class="container_12">
    <div class="grid_2">
        <a href="#display_appointments" data-role="button">Today</a>        
    </div>
    <div class="grid_8">
        <div id="justify-div">
            <div data-role="controlgroup" data-type="horizontal">
                <a href="#display_appointments" data-role="button">Day</a>
                <a href="#display_appointments_list" data-role="button">List</a>
                <a href="#display_appointments_month" data-role="button">Month</a>
            </div>
        </div>
    </div>       
    <div class="grid_2">
        <a href="#display_appointments" data-role="button">Refresh</a>        
    </div>       
</fieldset>
于 2012-12-17T19:14:41.223 に答える
0

レイアウト グリッドを使用して、複数の要素を 1 行に配置できます。

http://jquerymobile.com/demos/1.2.0/docs/content/content-grids.html

于 2012-12-17T06:03:12.960 に答える