Image swopping
document.(Name).src
A step up from Rollovers is being able to swop the images using an automated script method
I simpler method may be to use animated GIFs but this gives you no control once you have designed your GIF
<img name="message" src="images/0.jpg" alt="message" width="300" height="100">
<script type="text/javascript">
var message = new Array ()
for (messagebuild =0; messagebuild<=3; messagebuild++)
{
message[messagebuild] = new Image()
message[messagebuild].src = "images/" + messagebuild + ".jpg"
}
var count = 0
function messagecycle()
{
document.message.src = message[count].src
if (count==2)
{
count=0
}
else
{
count++
}
setTimeout("messagecycle()", 1000)
}
setTimeout("messagecycle()", 1000)
</script>
Precaching is used in the form of an array. Messagecycle points to each image in turn, then repeats
Image swopping example, Nixie clock
Image swopping example, KnightRider lights
Image swopping example, Binary clock
Image swopping example, LED alarm clock (You need to enable popups on your browser)
Image swopping example, pulsing lights 1 (Complete with window.status output useful for debugging)
Image swopping example, pulsing lights 2
Image swopping example, pulsing lights 3
Image swopping example, randomly pulsing lights
Page12