Bootstrap 4多项旋转木马(一次显示多个旋转木马项目) [英] Bootstrap 4 Multiple Items Carousel (several carousel items shown at once)

查看:366
本文介绍了Bootstrap 4多项旋转木马(一次显示多个旋转木马项目)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在Bootstrap 4中实现多项旋转木马?文档提到了多个轮播而不是带有多个项目的轮播。

How do you implement a multiple items carousel in Bootstrap 4? The docs mention about multiple carousels but not a carousel with multiple items.

推荐答案

您可以一次显示一个轮播项目,但是用多个元素填充它。类似于:

You can display one carousel item at a time, but fill it with multiple elements. Something like:

.item
  .col-xs-4
     {content}
  .col-xs-4
     {content}
  .col-xs-4
     {content}

但是你可能希望你能一次推进一个。开箱即用就不会发生这种情况。在实施了许多旋转木马后,我建议在Bootstrap不符合要求的情况下寻找另一个旋转木马库。 Slick.js是我的许多carousel配置选项的首选库。它相当纤薄~5k min'd和gzipped。

But you may then be wishing you could advance them one at a time. That isn't going to happen with bootstrap right out of the box. After implementing many carousels, I'd recommend seeking another carousel library when Bootstrap's doesn't fit the bill. Slick.js is my go-to lib for lots of carousel config options. And its a fairly slim ~5k min'd and gzipped.

如果您在使用bootstrap时遇到困难,这里有一个脚本可以提供单个高级多项: http://codepen.io/MarkitDigital/pen/ZpEByz

If you're hard-set on using bootstrap, here is a script that can provide single advance, multi-items: http://codepen.io/MarkitDigital/pen/ZpEByz

这篇关于Bootstrap 4多项旋转木马(一次显示多个旋转木马项目)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆