Flickity选项groupcells和wraparound以及不均匀的单元格数量

时间:2017-03-07 16:51:19

标签: javascript html css flickity

我正在尝试创建一个始终显示两张幻灯片的无限滑块。
Flickity滑块有两个选项:groupcells和wrapround。

问题在于,如果细胞数量不均匀,可以说五个细胞,第五个细胞将是孤立的。所以分组如下:[1,2] [3,4] [5]。
我希望分组为[1,2] [3,4] [5,1] [2,3] [4,5] [1,2]。

我有一个想法就是复制单元格的HTML,这样就可以代替5个单元格而不是10个单元格。

如果有人有更好的想法,我想知道。

这是问题的codepen

<!-- Flickity HTML init -->
<div class="carousel" data-flickity='{ "groupCells": 2, "wrapAround": true }'>
  <div class="carousel-cell"></div>
  <div class="carousel-cell"></div>
  <div class="carousel-cell"></div>
   <div class="carousel-cell"></div>
  <div class="carousel-cell"></div>
</div>

0 个答案:

没有答案