0

BootstrapResponsiveの使用-HTMLは次のように表示されます...

<div class="row-fluid Center">
    <div id="divMapCanvas" class="span6">
        <div id="map_canvas">
        </div>
    </div>
    <div id="divMapPanel" class="span6">
        <div id="map_panel">
        </div>
    </div>
</div>

テストWebページ：http：//gfw.yyyz.net/Contact

私がやりたいのは、最初にdivMapPaneldivを非表示にし、divMapCanvasdivをページの中央に配置することです。次に、方向ボタンが押された後、divMapCanvasが左に移動し、divMapPanelが表示されます。divMapPanelを非表示にしようとしましたが、divMapCanvalを中央に配置できません。

何か提案を事前に感謝しますか？

4

1 に答える 1

2

キャンバスをラップするクラスのあるdivでspan6、固定幅を設定する必要があります（サンプルページでwidth: 526px;機能するようにしたときに使用しましたが、代わりに％を使用することもできますが、デフォルト設定であるauto）、float: none;およびを追加してフローティングを取り除く必要もありますmargin: 0 auto;。

で、divMapPanelを追加display: noneして、DOM内のスペースを占有しないようにする必要があります。visibility: hiddenたとえば、使用は機能しません。

次に、ユーザーが方向をクリックして両方の要素を並べて表示する場合は、float: leftなどを追加してこれらの設定を削除すると、両方の要素が並べて表示されます。

于 2012-07-07T10:58:40.817 に答える