1

ブートストラップのカルーセルにはいくつかの問題があります。

  1. カルーセルは、最初の間隔が経過するまでレンダリングされません。カルーセルを自動再生したくないので、オプション interval: false を使用してみましたが、カルーセルがレンダリングされません。
  2. 次または前のボタンをクリックすると、#carousel が URL に挿入されますが、これは非常に望ましくありません。

HTML:

<div id="myCarousel" class="contributors-carousel carousel slide">

          <div class="carousel-inner">
            <div class="item">
              <div class="container">
                <div class="contributor">
                  <img class="img-circle" src="http://redacted/image.gif" />
                </div>
              </div>
            </div>

            <div class="item">
              <div class="container">
                <div class="contributor">
                  <img class="img-circle" src="http://redacted/image.gif" />
                </div>
              </div>
            </div>

            <div class="item">
              <div class="container">
                <div class="contributor">
                  <img class="img-circle" src="http://redacted/image.gif" />
                </div>
              </div>
            </div>

          </div>

          <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
          <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>

        </div>

jQuery:

$('#myCarousel').carousel();

気軽に試してみてください。

[編集済み]

4

1 に答える 1

1

コードで修正する 3 つのこと

  • @Blakeが言ったように、IDをmyCarousel変更するか、セレクターを変更する必要があります
  • どの画像が最初に表示されるかを指定していません (activeいずれかのクラスitem)
  • あなたは何か奇妙なことをしたcontributors-carousel

コードが修正されたブートプライは次のとおりです。http://bootply.com/69067

于 2013-07-22T23:56:50.260 に答える