In a few seconds this image will turn orange! This script would work great if you want an
origional image to load first (maybe a black and white) and then a final image to load
over it (the color version of the B&W).
<!--To use this script copy this part into your
<head></head> tag. You need to edit the image location where it says
"YOUR FIRST RELOADED IMAGE" and "YOUR FIRST ORIGIONAL IMAGE" -->
<script language="JavaScript">
function startTime(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
closeTime=hours*3600+mins*60+secs;
closeTime+=3; // If you want it to wait loading longer or shorter adjust this number accordingly.
Timer();
}
function Timer(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
curTime=hours*3600+mins*60+secs
if(curTime>=closeTime)
reloadimg();
else
window.setTimeout("Timer()",1000)
}
function reloadimg(){
document.img1.src = "YOUR FIRST RELOADED IMAGE"
}
</script>
<!-- Now put this image any where in your page Body section of your page-->
<img src="YOUR FIRST ORIGIONAL IMAGE" name="img1">
If you want to add more images, you need to add this line to the top script.
document.img2.src = "YOUR SECOND RELOADED IMAGE"
Your top script should now look like this.
<script language="JavaScript">
function startTime(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
closeTime=hours*3600+mins*60+secs;
closeTime+=3; // If you want it to wait loading longer or shorter adjust this number accordingly.
Timer();
}
function Timer(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
curTime=hours*3600+mins*60+secs
if(curTime>=closeTime)
reloadimg();
else
window.setTimeout("Timer()",1000)
}
function reloadimg(){
document.img1.src = "YOUR FIRST RELOADED IMAGE"
document.img2.src = "YOUR SECOND RELOADED IMAGE"
}
</script>
Now here is the code for the second image.
<img src="YOUR SECOND ORIGIONAL IMAGE" name="img2">