java script help

[superstar2k9]

Hi all i have posted a few questions regarding java script i have this script

<script>

//Time of day message script- by javascriptkit.com
//Visit JavaScript Kit (http://javascriptkit.com) for script
//Credit must stay intact for use

var Digital=new Date()
var hours=Digital.getHours()

//Configure message below to your own.
if (hours>=5&&hours<=11) //MESSAGE FOR MORNING
document.write('<b>Welcome to our site. Good morning visitor.</b>')
else if (hours==12) //MESSAGE FOR NOON
document.write('<b>It is high noon. Thanks for dropping by!</b>')
else if (hours>=13&&hours<=17) //MESSAGE FOR AFTERNOON
document.write('<b>Good afternoon, and thanks for visiting.</b>')
else if (hours>=17&&hours<=19) //MESSAGE FOR EVENING (6pm-8pm)
document.write('<b>Good evening. Hope you\'re enjoying the gentle breeze</b>')
else if (hours>=18&&hours<=11) //MESSAGE FOR NIGHT (9pm-11pm)
document.write('<b>Glad to see you this time of the night.</b>')
else //MESSAGE FOR LATE NIGHT, EARLY MORNING (12pm-4am)
document.write('<b>Wow, thanks for choosing to visit our site over sleep!</b>')

</script>



on These line's

else //MESSAGE FOR LATE NIGHT, EARLY MORNING (12pm-4am)
document.write('<b>Wow, thanks for choosing to visit our site over sleep!</b>')

i wish to change it from displaying the message
Wow, thanks for choosing to visit our site over sleep!</
into an image so lets say my image is named will.jpg how would it look

Im guess is something like this

else if (hours>=15&&hours<=16) //MESSAGE FOR NIGHT (15pm-16pm)
} else if (timeNow < 18) {img = 'will.jpg';

PLease help

[jamiemac2005]

Hey, you need to make sure the image has an ID:

<img src="initialImage.jpg" id="theImage" />

Then at the top of the script you should then add the line:

var theImage = document.getElementById("theImage");

to reference the image.

Then where the document.write code is you should change it to:

theImage.src="will.jpg";

which will change the source attribute of the image (changing the image).

Cheers,
Jamey

[superstar2k9]

thanks jamey i followed the instructions you posted but i cant seem to get it working this is what i have

<script>

//Time of day message script- by javascriptkit.com
//Visit JavaScript Kit (http://javascriptkit.com) for script
//Credit must stay intact for use

var theImage = document.getElementById("will");
var Digital=new Date()
var hours=Digital.getHours()



//Configure message below to your own.
if (hours>=5&&hours<=11) //MESSAGE FOR MORNING
<img src="will.jpg" id="will" />

this only gets one image for me how would it look when finished sorry thats a bit rude asking you to practicly do it for me i been scratching my head so much over this i think the problem lies with the getElementById part because it is refering to one image maybe i am just not reading your instructions right . either that or i am spending to long infront of this screen and lost all sence of what the code is even for lol seriously i need help

thanks jamey


william

[jamiemac2005]

Haha, sorry that's my mistake actually, because this happens when the page loads the work on the image is done before the image is created... So lets go about it slightly differently (using the dynamic creation method idea proposed by the script)...

<script type="text/javascript">

//Time of day message script- by javascriptkit.com
//Visit JavaScript Kit (http://javascriptkit.com) for script
//Credit must stay intact for use

var Digital=new Date()
var hours=Digital.getHours()

//Configure message below to your own.

//create an image object
var theImg = document.createElement("img");
//give it properties(uncomment these and modify as necessary)
//theImg.style.width="100px";
//theImg.style.height="100px";


//add the image to the document
document.body.appendChild(theImg);

//set the source of the image appropriately
if (hours>=5&&hours<=11) //MESSAGE FOR MORNING
  theImg.src = "morningPic.jpg";
else if (hours==12) //MESSAGE FOR NOON
  theImg.src = "noonPic.jpg";
else if (hours>=13&&hours<=17) //MESSAGE FOR AFTERNOON
  theImg.src = "afternoonPic.jpg";
else if (hours>=17&&hours<=19) //MESSAGE FOR EVENING (6pm-8pm)
  theImg.src = "eveningPic.jpg";
else if (hours>=18&&hours<=11) //MESSAGE FOR NIGHT (9pm-11pm)
  theImg.src = "nightPic.jpg";
else //MESSAGE FOR LATE NIGHT, EARLY MORNING (12pm-4am)
  theImg.src = "earlymorningPic.jpg";

</script>

Put that in the body of your page where you want the image to appear and it'll work fine.

sorry thats a bit rude asking you to practicly do it for me

Don't worry =] You made a good go of it, and that's all we ask =]

Cheers,
Jamey

[superstar2k9]

errrr hay jamey yeah is still not working for me i even changed the <script type="text/javascript"> to <script type="img/javascript"> but computer says no with dreamweaver i also tried adding the

theImg.src = "<img src="<img src="phil.jpg" longdesc="IMAGES/phil.jpg";

the long longdesc= as you can see. but no joy . I dunno what to try now

thanks

william

[jamiemac2005]

Give me the entire code of your page(from HTML to /HTML) and i'll see what's going wrong. It should be:

<script type="text/javascript">

But yeah, post your code, in [code] tags(so that it looks like that^), and i'll take a look over the script, but i got it working as:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
	<head>
		<title>Testing</title>
	</head>
	<body>
		<script type="text/javascript">

//Time of day message script- by javascriptkit.com
//Visit JavaScript Kit (http://javascriptkit.com) for script
//Credit must stay intact for use

var Digital=new Date()
var hours=Digital.getHours()

//Configure message below to your own.

//create an image object
var theImg = document.createElement("img");
//give it properties(uncomment these and modify as necessary)
theImg.style.width="100px";
theImg.style.height="100px";


//add the image to the document
document.body.appendChild(theImg);

//set the source of the image appropriately
if (hours>=5&&hours<=11) //MESSAGE FOR MORNING
  theImg.src = "morningPic.jpg";
else if (hours==12) //MESSAGE FOR NOON
  theImg.src = "noonPic.jpg";
else if (hours>=13&&hours<=17) //MESSAGE FOR AFTERNOON
  theImg.src = "afternoonPic.jpg";
else if (hours>=17&&hours<=19) //MESSAGE FOR EVENING (6pm-8pm)
  theImg.src = "eveningPic.jpg";
else if (hours>=18&&hours<=11) //MESSAGE FOR NIGHT (9pm-11pm)
  theImg.src = "nightPic.jpg";
else //MESSAGE FOR LATE NIGHT, EARLY MORNING (12pm-4am)
  theImg.src = "earlymorningPic.jpg";

</script>
	</body>
</html>

Did you make sure the images were labelled correctly? (And expand on "doesn't work", does it just not show the image?)

Cheers,
Jamey