Open stijink opened 6 years ago
Hey Stephan,
Thank you for this question, you have actually pointed out a clear weakness in the library as it's not built for easy animation/transition speed customization. That I believe I can fix in the next release without much work. However since that might take me a bit more time than you have available to wait for, I suggest you do the following tweak in the CSS part for the component in which you are using transitions from the library. Let's assume you go with the name I suggested for your custom animation in my previous answer (to your other question in #12), so you should do something like this:
<template>
<custom-fade-in-out-down id="myCoolAnimation">
<NewPhotos v-show="isVisible" />
</custom-fade-in-out-down>
</template>
<style>
/* 3 seconds animation for your transition, both fade in and out*/
#myCoolAnimation {
animation-duration: 3s;
-webkit-animation-duration: 3s;
-moz-animation-duration: 3s;
}
</style>
More information about that can be found in Animate.css github page. Hope this helps while I find some time to add duration and delay customization to the library itself. Thanks again for your interest and questions!
Thank you for your quick and helpful response :-)
Hi,
another question. Is there a way / property to control the speed of an transition ? :)
Thanks, Stephan