Keyframe Animation Syntax

Submitted by:Andery Smith

Date added:22 March, 2012

Category:CSS

Basic Declaration & Usage of Keyframe Animation Syntax

Tags: keyframe , animation syntax

Code Snippet:

@-webkit-keyframes NAME-YOUR-ANIMATION {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes NAME-YOUR-ANIMATION {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-ms-keyframes NAME-YOUR-ANIMATION {
0% { opacity: 0; }
100% { opacity: 1; }
}


#box {
-webkit-animation: NAME-YOUR-ANIMATION 5s infinite;
-moz-animation: NAME-YOUR-ANIMATION 5s infinite;
-ms-animation: NAME-YOUR-ANIMATION 5s infinite;
}
 
 

Comments