Stack Overflow
Stack Overflow

Questions tagged [flickity]

JS/CSS library to create touch, responsive, flickable galleries.

JS/CSS library to create touch, responsive, flickable galleries.

Written by Metafizzy.
Official website.
On Github.

226 questions
2
votes
0 answers

Flickity - Problem with syncing two carousels as well as having cutom buttons

I need to have two synced carousels, one above the other both controlled by the same set of custom buttons. I have managed to get them to sync and have implemented custom buttons that control both of them but here's the problem; whilst the custom…
Marc
  • 348
  • 1
  • 3
  • 9
2
votes
1 answer

Vertically center a carousel inside a section

I have a really basic Flickity carousel with some images. My problem is it reamins on the top of the page and I want to center the whole carousel vertically inside my section. My section height is equal to my device's height, so its basically a…
Frigyes Vass
  • 139
  • 1
  • 4
  • 17
2
votes
1 answer

Flickity not hiding on desktop

I want the flickity slider to hide on desktop and larger devices. I think I'm following the instructions in the documentation, they seem pretty straightforward, however, It's not working. Div looks something like this:
Fermín Rodríguez del Castillo
  • 92
  • 1
  • 9
2
votes
2 answers

Flickity is not a function

I'm trying to have a custom button with a click functionality to move to the next slide. I am doing it exactly like in this official example: https://codepen.io/desandro/pen/emVpdz But I get always this error from the console: Uncaught TypeError:…
netzwerkstatt
  • 33
  • 1
  • 4
2
votes
2 answers

How to increase the height of the Flickity slider?

I am using Flickity. I have groupCell true. Now the issue is, I am not able to increase the height of the image or slider height. Also, I have to display the 1 slider in mobile device. Would you help me out? $('.slideset').flickity({ //…
Naren Verma
  • 2,205
  • 5
  • 38
  • 95
2
votes
1 answer

Flickity carousel slide number and length

I'm using a Flickity carousel in my website and I found the piece of code (link below) that allows me to see the slide number and length. https://codepen.io/desandro/pen/dpPzab After placing that in my website it didn't work and I get this message…
Bruno C
  • 37
  • 11
2
votes
2 answers

Flickity carousel: Wrap prev and next buttons inside a custom div

I'm working with flickity carousel, and I want to warp next and prev buttons inside some custom div. By default, flickity creates the buttons dinamically as direct children of the .main-carousel div/section. This is the code i'm getting running…
Fedegiro
  • 53
  • 3
  • 9
2
votes
2 answers

Flickity - Show 2 slides but only slide 1 at a time

I've got a slider where 2 slides should be shown at a time, but when swiping it should only slide 1 at a time, is that possible? I can get it to show 2 at a time, but it then slides 2, to do that I used the groupCells option.
Elliott Coe
  • 543
  • 3
  • 6
  • 18
2
votes
0 answers

DOMException: "Node was not found" error when using JQuery flickity slider in ReactJS component

I'm using the Flickity slider in ReactJS (maybe you ask why I'm using a jquery library in React? because slick slider does not support RTL, and my website is RTL, and it's important to me to see carousels are starting from the right, and also slick…
Reza Erami
  • 153
  • 2
  • 6
2
votes
1 answer

Flickity on page load shows vertical before horizontal

When my page first loads, I see the elements vertically before flickity shows the slide. How can I prevent this using flickity or css? I tried css using .gallery { height:100px; } but it still expands the div to show all elements before collapsing…
Raw Roy
  • 31
  • 4
2
votes
0 answers

How can I disable dragging in one direction with a flickity wrapAround carousel?

I have a simple 30 item Flickity carousel with wrapAround set to true. Is there away to disable dragging from right to left but leave left to right dragging working? I can turn it on/off like so: $carousel.flickity('unbindDrag'); But I don't want it…
Julian Guy
  • 21
  • 4
2
votes
2 answers

How to hide border flickity in Chrome

anyone please help, how to hide border flickity slider in chrome. The border just show in Browser Chrome only. may be like this : or u can visit my blog : aqiqoh-syafaat.blogspot.co.id thanks
Rohmat
  • 71
  • 9
2
votes
1 answer

Flickity done callback?

I'm using flickity with react. I'm instantiating it like this: this.flky = new Flickity('.carousel', flickityOptions) Flickity applies position: absolute to images and then uses it to measure some sizes, I need to change this position to static…
Himmators
  • 14,278
  • 36
  • 132
  • 223
2
votes
1 answer

Flickity complete event when initialized with HTML

Is there an event that I can listen to, when Flickity has finished initialization? When initializing with JavaScript, I can trigger an event by myself, but by using this setup I have no clue. Initialize with…
Mario
  • 8,253
  • 2
  • 14
  • 29
2
votes
1 answer

How to import css from libraries via postCSS?

I am using this library for slideshows called Flickity that requires to use its css file flickity.min.css. In my project I use postCSS and when including this flickity.min.css into my components css like: @import ./lib/flickity.min its classes get…
Ilja
  • 44,142
  • 92
  • 275
  • 498
1 2
3
…
15 16