The slider I created has animations that are taking too long to transition between slides. I have tried adjusting the properties, but I can't seem to find the right one to control the speed of the transitions.
/* Keyframes */
@-webkit-keyframes animation_slides {
0%
{
opacity:0;
}
6%
{
opacity:1;
}
24%
{
opacity:1;
}
30%
{
opacity:0;
}
100%
{
opacity:0;
}
}
/* Animations on my ul li elements */
-webkit-animation-name: animation_slides;
-webkit-animation-duration: 30.0s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
&:nth-child(2)
{
-webkit-animation-delay: 6.0s;
-moz-animation-delay: 6.0s;
}
&:nth-child(3)
{
-webkit-animation-delay: 12.0s;
-moz-animation-delay: 12.0s;
}
&:nth-child(4)
{
-webkit-animation-delay: 18.0s;
-moz-animation-delay: 18.0s;
}
&:nth-child(5)
{
-webkit-animation-delay: 24.0s;
-moz-animation-delay: 24.0s;
}
If anyone can offer assistance, it would be greatly appreciated. Thank you!