Adding a “blinds” transition to my version of Flickity carousel

Question

I have put together THIS codepen slider (carousel) that uses the captions as controls, with the help of the Flickity plugin, with these 2 options:var flkty = new Flickity(".carousel", {
pageDots: false,
wrapAround: true
});
Note: the slider has videos, not images.

I need a transition similar to the blinds transition that antoni.de carousel has.

Questions:

What is the easiest and fastest way to do that? Is it a CSS thing only?
Do I have to write specific JavaScript for this transition?
I would rather borrow that JavaScript, where can I find it in a readable, unminified version?
The code version of the carousel is HERE.

UPDATE: I have added a partial answer. As I say in the answer, I wish I could use the videos themselves for the transition.

0
Marian 3 years 2019-12-06T03:21:26-05:00 0 Answers 85 views 0

Leave an answer

Browse
Browse