Animation with CSS files
Last month there was an introduction to use of CSS files showing how they could be used to control the display of various components of a web page.
However, as well as the 'static' content of a web page the latest versions of web browsers can now read instructions from the CSS file to create movement on the page - not just the movement in a video file.
Today, we will see some of these but I wont bore you with explanations of how they work. Hover your mouse over the images to see some of the possible actions.
Historically web pages have used Graphical Interchange Format (GIF) files to create movement. These files are made up from several independent images which show sequentially (most over and over) on a web page. Mostly they are quite jerky in their action as in the top left image of a golfer.
The Caterpillar and Alice looked at each other.
This image was downloaded from a search of Google - Images with the subject golfer .gif where there are dozens of them. |
|
Hover your mouse over this image The Captain of our Club has just advised that we cannot play in June, but our scheduled match in July will go ahead. The rest of this text is just rubbish to show possibilities. |
The image has been rotated, its back made a solid colour and the information about the picture added. Like me those in love with Cranbourne may recognise the bunker. |
The colour will cycle
|
Help me
|