CSS animation direction is the property of CSS (Cascading Style Sheets). It describes wheter an animation should be played forwards, backwards or in alternate cycles.
Questions tagged [css-animation-direction]
8 questions
1
vote
1 answer
How to remove a sharp start?
I just got acquainted with animation in CSS. And I ran into the problem that it is not possible to do smoothly so that the animation goes in cycles and is not interrupted.
I tried a lot of different options and through crutches. There were even…
Timur
- 13
- 2
1
vote
0 answers
Why is my keyframes animation only working one way?
I have a CSS keyframes animation that I'm using like so:
.content[docked=true] {
animation: dockContent ease var(--dock-animation-time);
animation-direction: normal;
animation-fill-mode: forwards;
}
.content[docked=false] {
…
Ewan Green
- 49
- 8
1
vote
0 answers
Trying to effect parent element by hovering child element
CSS
.tilt-box{
position: relative;
width: 100%;
display: flex;
flex-direction: column;
perspective: 500px;
transform-style: preserve-3d;
transform: rotateX(-0deg) rotateY(0deg); …
Salil Rajkarnikar
- 588
- 1
- 7
- 26
1
vote
2 answers
Oscilatory Animation CSS: How to avoid abrupt transition from 100% to 0%?
I am trying to make an Oscillatory animation using css as shown below:
Here's how I have created my animation:
@keyframes rotateFeather {
0% {
transform: rotate(0deg);
}
25% {
transform: rotate(-180deg);
}
50% {
…
Shivam Sahil
- 4,055
- 3
- 31
- 62
0
votes
1 answer
How to set animation unset when it is hovered
I want to add animated footer to my project. It has animation which goes from right to left and then disapears, and it is in the loop. I want it to stop when it is hovered but since there are 2 animation, I want both of them stop when .Footer class…
breking bed
- 135
- 2
- 14
0
votes
1 answer
How to (animated) scale out from center instead of from the left side
I have the following code on jsfiddle but I want the image to scale out from the center as opposed to from the left hand side
What do I need to add to the code to make this happen?
Thanks in advance
https://jsfiddle.net/kayanna/oc9jyruq/6/
img {
…
LouiseF
- 27
- 1
- 5
0
votes
2 answers
How to animate a pop up on show and close using css?
I have a layout as follows,
container - to hold all the cards.
card - div for containing information.
In the above Image, the left one shows the initial rendering of the screen,
When user clicks on any inner card, the corresponding card should…
Anil
- 1,748
- 8
- 32
- 67
0
votes
2 answers
CSS animation-direction not working as I would have expected
N.B. With the (more complex) setup I'm actually working with I can't use CSS Transitions. I recognise that CSS Transitions would be a
perfectly good solution in the example below.
I'm having a little trouble with
animation-direction:…
Rounin
- 27,134
- 9
- 83
- 108