Forum Moderators: open

Message Too Old, No Replies

js help needed

image changing by time of day

         

fencer7824

8:46 pm on Jan 5, 2004 (gmt 0)



I'm not very smart on javascript, but I'm trying to get an image on my main page to change depending on the time of day. I found a script for it in another posting, but I don't know how to use it. The following is the code.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="style.css">
<SCRIPT LANGUAGE = 'JavaScript'><!--
var date = new Date();

var time = date.getHours();

if (time<12) {document.write("<IMG SRC='Images/baldy_web.jpg width="590" height="259" border="0"'>")
}
else if (time<16) {document.write("<IMG SRC='Images/golf_web.jpg width="590" height="259" border="0"'>")
}
else if (time<20) {document.write("<IMG SRC='Images/riverrun_web.jpg width="590" height="259" border="0"'>")
}
else {document.write("<IMG SRC='Images/historic_web.jpb width="590" height="259" border="0"'>");
}
//--></SCRIPT>

</head>

<body>

<table width="100%" border="0">
<tr>
<td height="31" colspan="3">
<h3><marquee direction="left">Visiting Sun Valley? Check out the following web pages for more information<a href="http://www.sunvalley.com" target="_blank"> www.sunvalley.com</a> and <a href="http://www.ypcity.com" target="_blank">www.ypcity.com</a></marquee></h3></td>
</tr>
<tr>
<td width="22%" height="299"> <h5>Looking for High-Speed Internet access while
enjoying the beautiful Sun Valley area?</h5>
<h5>Call us today!</h5></td>
<td width="61%"> THIS IS WHERE THE SCRIPTING NEEDS TO OCCUR </td>
<td width="17%"><h5>Forgot your network card? Don't worry, we'll rent you one
while your visiting!</h5></td>

TrinkDawg

11:16 pm on Jan 5, 2004 (gmt 0)

10+ Year Member



Hi Fencer, if you move the <script>...</script> section to where you indicate that the script needs to execute, it will execute there. JavaScript that is in the body of a page executes as it happens. I am assuming that the image sources and settings are yours already.

broniusm

12:51 am on Jan 6, 2004 (gmt 0)

10+ Year Member



fencer-
yes, TrinkDawg is correct. To elaborate a bit, you can easily inspect your jscript example and follow the logic and see the simple html in action:
- if the time is a certain value,
- print the corresponding familiar html <img> tag corresponding to the image you want

Essentially, you'll be using javascript here to dynamically write HTML to the client browser instead of just feeding the browser hardcoded html.