Small examples of animations using CSS. See each of the examples just below.
This example makes use of CSS animation techniques and JavaScript. Click here.
Star Wars is a science-fiction franchise comprising movies, books, comics, video games, toys, and animated shows. Star Wars has become part of mainstream popular culture, as well as being one of the highest-grossing series of all time.
This simple example uses CSS and images to illustrate the rotation of the moon around the earth. Click here.
The moon orbits along an elliptical path (although it is very nearly circular - eccentricity is about 0.05.). It takes just over 27 days to complete one orbit with respect to the stars (sidereal), or about 29.5 days with respect to the sun.
This example uses only CSS for animations. It is inspired by the classic PAC-MAN video game. Click here.
On May 22, 1980, the Pac-Man video game was released in Japan and by October of the same year, it was released in the United States. The yellow, pie-shaped Pac-Man character, who travels around a maze trying to eat dots and avoid four mean ghosts, quickly became an icon of the 1980s. To this day, Pac-Man remains one of the most popular video games in history.