1

次のようなものを実現したいと思います。CircularContentCarousel ですが、Bootstrapを使用しており、すでにCarouselコンポーネントが含まれています。

Bootstrapのカルーセルとおそらくいくつかのjqueryを使用して同じ機能/効果を達成できる方法はありますか?または、これを達成する他の方法を知っている人はいますか?グリッドレイアウトのせいでかなり混乱しています。

PS参照サイトで「続きを読む」をクリックしたときの効果には興味がありません。

助けてくれてありがとう!

4

1 に答える 1

2

さて、私はちょうどいくつかの有効期限を試しました、そして私は私が欲しいものを手に入れたと思います。基本的に、私はspan10divに5つのボックスを収めようとしていました。ただし、5つのボックスは静的ではないため、6または7以上になる可能性があります。そのため、「アクティブアイテム」として一度に5つのボックス(1つの「行」)を表示しようとしました。5つのボックス(実際にはdiv)はそれぞれ1つのアイテムです。

だから、あなたはすでにそれを手に入れていると思います。静的データを使用した以下のコードは次のとおりです。

<div class="span10">
<div id="myCarousel" class="carousel slide">
    <div class="carousel-inner">
        <div class="active item">
            <div class="row">
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
            </div>                          
        </div>
        <div class="item">
            <div class="row">
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </div>
                <div class="span2 logs">                                                               
                    <h4>Span 2</h4>
                    <p>Carousel caption text<p>                            
                </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>

基本的に、右または左への各スクロールに5つのボックスが表示されます。最後のグループが5未満の場合を除きます。

于 2012-11-13T09:01:52.977 に答える