How to set image count per page using flicikity slider

Question

I am using flicikity slider for homepage. My problem is, I can't set more than 4 images per page.

I read the document fully. I can't find the perfect answers.

I used siema package there is an option called "perPage: 1", this option solved my problem. But there is no option like this. Also, I tried some CSS tricks like reduce width & height size. But there is no use.

Prashen · Answer 1 · 2019-11-14T07:31:31.633

0

I think they automatically add slider on each div see the codepen solution here:

HTML

<div class="carousel"
  data-flickity='{ "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 class="carousel-cell"></div>
  <div class="carousel-cell"></div>
  <div class="carousel-cell"></div>
</div>

CSS

* { box-sizing: border-box; }

body { font-family: sans-serif; }

.carousel {
  background: #EEE;
}

.carousel-cell {
  width: 66%;
  height: 200px;
  margin-right: 10px;
  background: #8C8;
  border-radius: 5px;
  counter-increment: carousel-cell;
}


.carousel-cell:before {
  display: block;
  text-align: center;
  content: counter(carousel-cell);
  line-height: 200px;
  font-size: 80px;
  color: white;
}

edited Nov 14 '19 at 07:31

answered Nov 14 '19 at 07:25

Prashen

101
8

Thanks for your replay.I think you forget to add codepen link. – PrakashT Nov 14 '19 at 07:30
It was showing unable to add codepen link https://codepen.io/prashen/pen/LYYgLrX – Prashen Nov 14 '19 at 07:32
@PrakashT If it helps you please don't forget to make the answer accepted. Thanks :) – Prashen Nov 14 '19 at 07:41
Sorry. your solution not helped for me. – PrakashT Nov 14 '19 at 08:15
Please provide some example code on codepen or somewhere. It's difficult to understand the scenario. – Prashen Nov 14 '19 at 08:21

How to set image count per page using flicikity slider

1 Answers1