3

ブートストラップカルーセルを使用して、ページのサブセクションを循環しています。これは大画面では完璧にフィットしますが、モバイルではサブセクションを次々に単純に表示したいと思います。これは可能ですか？

したがって、たとえば（明確にするために）

[バージョン情報]セクションの下のデスクトップには、[次へ] / [前へ]ボタンでミッション、連絡先、クライアントリストを循環するカルーセルがあります。

モバイルでは、これら3つのセクションを重ねて表示し、通常どおりスクロールします。次/前へのボタンはありません。

ありがとう。

4

1 に答える 1

6

メディア クエリを使用して、カルーセル アイテムのブートストラップのデフォルト スタイルをオーバーライドすることで、最終的にこれを非常に簡単に行うことができました。

@media (max-width: 767px) {
    #myCarousel {
        .item { 
            display:block;
            padding-bottom:10px;
        }
    }
}

.itemこれは、通常は until に設定されてdisplay:noneいるカルーセルを取り、.active少しパディングして次々に表示します。これは、ブートストラップのカルーセル動作を無効にしたり中断したりしませんが、カルーセル インジケーターとカルーセル ナビゲーションも非表示にすると、その動作にアクセスする方法がありません。

おそらく最もエレガントなソリューションではありませんが、機能します。

于 2013-04-26T15:06:04.683 に答える