Remove fade effect completely from Flickity gallery

Question

I'm using a Flickity gallery to automatic loop a series of image, however there is a fade transition between images. I'd like to remove this so that the images change instantly.

I've tried to follow the answers in this thread but they did not work. Remove Fade From Flickity Slider Transitions

I've tried adding this into the css but with no luck.

.carousel-cell {
  left: 0 !important;
  opacity: 0;
  transition: opacity 0s ease-in-out;
  z-index: -1;
}

.carousel-cell.is-selected {
  opacity: 1;
  z-index: 0
}

Answer 1

If you remove the transition property, there should be no animation whatsoever. According to the fiddle in the question you provided, if you simply remove the transition, there will be no transition at all.

Edit:

I've checked out Flickity directly on their website and they seem to be using some javascript to animate the transform property. If you are using anything similar, you will have to be making modifications to javascript and not the css.