HTML and CSS Reference
In-Depth Information
In this case I didn't want a smooth transition between each frame: I wanted
five clear frames that would repeat; hence, I used duplicate values to make the
text shadow stay the same across each different portion of the animation, for
example 0-19%.
Yo u c a n t h e n a p p l y t h i s a n i m a t i o n u s i n g t h e f o l l o w i n g c o d e :
#ad #hell {
animation: flamey-flamey 0.2s infinite;
This time you're not setting a delay or an animation-fill-mode , and the flames
will keep flaming infinitely.
The last change in the example was the way #frame2 appears on hover and
focus. This time I used a simple transform and transition:
#ad #frame2 p {
transform: scale(0);
transition: 1s all;
#ad:hover #frame2 p, #ad:focus #frame2 p {
: ;
Search WWH ::

Custom Search