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
1
vote
1 answer

React 'module not found' error (Flickity plugin)

I'm trying to add a Flickity carousel to my application. After having followed the instructions on npm to the best of my ability I'm getting this error: ./~/flickity-fix/js/flickity.js Module not found: Can't resolve 'classie/classie' in…
r_cahill
  • 577
  • 3
  • 9
  • 20
1
vote
2 answers

Using Youtube video embed with Flickity plugin

I have a small gallery powered by Flickity plugin that has images and Youtube embed videos in it. The markup is something like:
1
vote
1 answer

Flickity: is-selected class cannot view image

Yesterday I have a user-unfriendliness carousel. Then I search for other flexible and responsive carousel solution, then thankfully I got this Flickity's carousels a fun to flick by David DeSandro. Now, I got a problem in adding image. I cannot see…
user7843796
1
vote
0 answers

Flickity options groupcells and wraparound and uneven amount of cells

I'm trying to create an infinite slider that always shows two slides. The Flickity slider has two options: groupcells and wrap around. The problem is that with an uneven amount of cells lets say five cells, the fifth cell will be alone. So the…
user1081577
  • 469
  • 2
  • 8
  • 25
1
vote
1 answer

Flickity has two or more slides - Vanilla JavaScript

I'm using Wordpress and ACF flexible-layouts to create Flickity image galleries. I have 2 issues: How do i count the number of slides in the gallery. ( I want to only run Flickity if there are greater than 2 slides ) How to run multiple galleries…
1
vote
1 answer

How to use FlickityService to control the start / stop of player

I am developing a photo slideshow using the Angular Flickity directive. I can use FlickityService to call next and previous function to move the slide to the next and previous slide. But how can I control the start and stop of the player although…
lonefire
  • 11
  • 2
1
vote
1 answer

swipe and click to next slide

With flickity, is it possible to have two behaviours at the same time on the same slide? swipe (default and better four touch screen) click to next slide (better for desktop) I tried something like: var carouselCells =…
François Romain
  • 13,617
  • 17
  • 89
  • 123
1
vote
0 answers

Flickity carousel not sizing slides width correctly in Firefox

I try to use flickity to have a good looking lazy loading image carousel. It works great on chrome and safari but the slide doesn't size correctly to the image in firefox. Please try the following link with firefox and another browser to get the…
Oehoe
  • 49
  • 1
  • 1
  • 7
1
vote
2 answers

Flickity gallery - how to loop through once then stop autoplay

I am using Flickity gallery, and I want it to loop through once and then stop autoplaying. 3 is the final item in the gallery, so that's why I am trying to call it when the the gallery settles here. Thanks in advance! Here is my code so far: var…
Sarah Lesh
  • 61
  • 4
1
vote
1 answer

Flickity with ng-repeat not adding new item

I want to have a slider using Flickity and Angular's ng-repeat that I can push and pop items from. It's mostly working but the problem I'm having is that new items I push onto the slider don't get appended to the end. Instead the last item in the…
LCIII
  • 3,102
  • 3
  • 26
  • 43
1
vote
2 answers

Storing a function expression inside a link function of an angularjs directive and use it via ng-click

I have the following angularjs directive and I would like to be able to use ng-click to execute showMap() inside property-slider.html. What am I missing? (function() { 'use strict'; angular .module('myapp') …
Gab
  • 2,216
  • 4
  • 34
  • 61
1
vote
3 answers

JQuery. Change container width based on orientation of img within

I need to size a container based on the orientation of the img that is in it. So as to have a width:50% container for portrait images and a width:100% container for landscape images. The JQuery i was able to come up with, does not work. It just adds…
1
vote
0 answers

flickity asNavFor not working

this really drives me nuts - everything looks nice and works fine but the click events on the thumbnails don't do anything - anyway to debug this and figure out what's going on - hope somebody has an idea how to fix this - thanks - this is my code:…
user1678736
  • 2,133
  • 4
  • 16
  • 10
1
vote
2 answers

How to make carousel have a max width, and load without resize

http://codepen.io/Thisisntme/pen/rVRyJE Is a demo of my website. Currently, the carousel doesn't work until the page is resized. I have no clue how to fix that one... and I also want to know how I can make the carousel have a maximum width so that…
10 Replies
  • 426
  • 9
  • 25
1
vote
0 answers

Flickity: after drag/throw the selected cell is sometimes out of the gallery viewport

I am working on an infinite draggable Carousel using flickity by metafizzy. Using the freeScroll + wrapAround Props, it works quite nice selecting the next cell on drag. $('.gallery').flickity({ freeScroll: true, wrapAround: true, …
d3nn15
  • 23
  • 3