ANIMATION
animations by imagen8
Animation 1
CSS animations
Transition + Transform
Hover over the element below:
Think
outside the box
from inside the box
Note: This example does not work in Internet Explorer 9 and earlier versions.
Outline/text animation
Text color and outline size gradual changes in CSS.
Gradually change the outline-width property from 5px to 50px and back to 5px.
Gradually change the color of the text, from red, to blue, and back to red:
The outline-width property, and the text color property, is animatable in CSS.
Note: This example does not work in Internet Explorer 9 and earlier versions.
Changing hues
It even went well with his vest
Such a stunning coat of many colors
How he loved his coat of many colors
It was red and yellow and green and brown and Blue
Joseph's brothers weren't
Too pleased with what they saw
Note: This example does not work in Internet Explorer 9 and earlier versions.
Animation 2
Image animations
Animate Fade In and Out
Greyscale background image: Foreground image using "W3.CSS" animate-fading class.
GIF animation created in Photoshop
Hover - Sepia
W3.CSS animation using the "hover-sepia" effect.
Animation 3
Flash animations converted to movies.
Seasons "Duration: 0.35"
The Art of Black & White Photography "Duration: 0.18"
The Big Bang! "Duration: 0.20"