2016-07-27 9 views
3

ブートストラップ4には、card-columnsという新しい機能が付属し、masonryのようなページを作成します。だから私はブートストラップでpinterestのような動作を持つ無限のページを作りたいと思っています。しかし、新しい要素がcard-columnに挿入されると、新しい要素は左に挿入され、下には挿入されません。ブートストラップ付きの無限のページを作ることができます4つのカードの列

ですから、それを使用して無限のページを作成できますか?

+0

はい、可能です(http://www.codeply.com/go/KDgLEq6IGT)。あなたのコードを投稿してください。 – ZimSystem

答えて

1

Bootstrap 4 card columns(石工/関心事)の無限/無限スクロールの例です。

http://codeply.com/go/KDgLEq6IGT

この例では、角で行われますが、次の「ページ」の下部にロードされたときに、基本的にはcard-columns内部よりcard秒を追加します。

EDIT:CSSの列の順序は上から下にあり、その後、レンダリングされた列の順序がされるように、左から右へ。..

1 3 5 
2 4 6 

CSSの列の順序を変更する方法はありません。 Masonryのような別のソリューションを使用することをお勧めします。 https://github.com/twbs/bootstrap/issues/17882

+0

問題は、** card-column **の一番下にカードが追加されると、ページが再レンダリングされ、中央の行の上部にあるいくつかのカードが左に移動し、左の行が中央に移動するということです。 –

+0

あなたの例でも、すべての新しいカードは一番右の列に移動します。 –

関連する問題