Adding a “blinds” transition to my version of Flickity carousel
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", {
Note: the slider has videos, not images.
pageDots: false,
wrapAround: true
});
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.
Leave an answer