There are two ways:
- Animated GIF. Google a bit. My favorite image editor is GIMP (available for Linux and Windows at least), but you may prefer another. Basically, you create a repeating 'movie' that shows one frame every 5 seconds, and then loops back to the beginning.
- Use Javascript, see http://www.w3schools.com/js/js_timing.asp[^]; you may use
setInterval()
, and either replace the "src" attribute of a "img" tag, or (a little more advanced), change the style of the "img" to show different sprites. The idea is that if you have 4 images, each of them 200x100 pixels, you save them as a 200x400 bigger image, and you use css to change the offset of the visible part, like 'sliding' the image behind a viewport.
Your choice depends on the available tools (image editor), and your personal preference (do you want to sharpen your Javascript and CSS, or not).
Hope this helps,
Pablo.