OK, some next are beginning to learn about the animation, film property, and this will just specify
a style for the target element when the animation is not playing.
So it's before.
It starts after it starts or both of them get so let's see how this looks and stuff in your comment
animation film mode and let's go underneath your comment.
So let's grab our d'Hiv with the animation.
And they should be on top of this right now.
Animation and field mode, so let's start, first of all, our cube there again with one hundred pixels,
right one.
Let's go it.
Two hundred pixels.
Why am I still going at 100?
Let's mix it up.
OK, and let's go with the background color red and position it.
Relative.
OK, now I'm going to create, let's see, one, two, three, four.
Actually, three different keyframes, so let's go up here and the first one will be four forwards because
the animation film mode has actually free properties.
Well, first of all, none, which is not property, but it's there, which is the default value then
forwards, backwards and both.
So let's create a keyframe for each of them, which free of them that is so keyframe and we call this
forward.
So do any.
Yeah, and me forward.
Forwards.
OK, so this would be the key frame for the forwards type of animation film mode, and for this we're
going to go from.
So not for him, not like next time top.
And zero.
They're going to go.
To top from the top to her big source.
And we will also change your background color.
Two green.
Wait a second, something ain't right here, so close this one up.
This one and this.
OK, there's our first Kiffer, I'm going to copy this keyframe two more times, and this would be Packwood's.
I'm going to change the color to yellow.
It's basically the same information, only the kind of a change, but I need this changing of color.
For us to see the difference and the last one, I'm going to get here a background color of blue and
is going to go to, let's say, red, not purple.
Purple.
OK, and this would be both.
Now, it's no different here, you're going to call any nation name.
And the first one will be wait, and we name and the person is enemy forward, so this one right here.
OK, let's put it in here and going to compress two more times and we play it backwards.
And both.
OK, and then the comment, the last two out now for the duration of the animation back in here, animation
duration, I'm going to go with three seconds.
So let's see how the animation looks.
Philmont and we need this one direction curve.
And down here we have a female.
So let's hit refresh and we have our first one, which we didn't do anything because our first film
mode will be animation, Helmuth, and none.
OK, but this won't do anything.
But the animation will not play any style to the animal before or after it's executed.
So if you hit your refresh.
OK, nothing special happens.
But if I would do now a animation, forewords.
Now, with this said, the element will retain the style values that is set by the Leskie friend.
And it depends on the animation, direction and animation, the action count.
Okay, so let's take a look at how this looks set to flash again.
And there we go.
Okay, now let's change the animation name coming to this one, I'll change it to backwards and also
change the property hit backwards.
To save.
Just second, this one was exactly I should go to yellow.
Yes, let's hit refresh again and there we go, and the last one was both.
And let's hit refresh again.
But I also need to change the animation, so coming this one out and this one and like.
And we go.
OK, so that's it for the animation film called.