Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

need a javascript pro

Status
Not open for further replies.

superstar2k9

Technical User
Apr 25, 2009
2
ES
hi basicly what i am trying to do is update the images on my site due to time of day i am running a website for a local radio station and as each Dj starts there work there image will appear on the page i found theis javascript from here

I have not tested this code yet i want to insert images into this script that i have on the sit and set them to change by setting the time of day could someone anyone copy and paste this making it a little clearer on what or where i need to edit it for instants if a Dj is on air between 6pm and 8pm and there image is names jess.jpg (NOTE) The images will be in my source files on the server not coming from a url. how or where would this be entered into the code or is there a widget that can handle this and the code embeded to my site would be easyier many thanks.

--------------------------------------------------------------------------
This is the code :

<script language="JavaScript">

day=new Date() //..get the date

x=day.getHours() //..get the hour

if(x>=0 && x<4) **

document.write('<style type="text/css">body{background: white url(1st.jpg); color: black}"></style>')

} else

if(x>=4 && x<12) **

document.write('<style type="text/css">body{background: white url(2nd.jpg); color: black}</style>')

} else

if(x>=12 && x<18) **

document.write('<style type="text/css">body{background: white url(3rd.jpg); color: black}</style>')

} else

if (x>=18 && x<24) **

document.write('<style type="text/css">body{background: white url(4th.jpg); color: black}</style>')

}

</script>
 
This script will use the time on the LOCAL machine, not from the server, so if there is a time difference then the correct image may not be shown.

I'd recommend you do this on the server side to ensure that the time is the correct one for what you need.

Greg Griffiths
Livelink Certified Developer & ECM Global Star Champion 2005 & 2006
 
What are the "**"s for? They are invalid syntax AFAIK, and so your code will do nothing other than throw syntax errors. You should probably replace them with the correct character, "{".

I can also recommend you do this a different way. Using document.write when you don't need to sucks, IMHO. Here's how I would do it, putting this code in the HEAD section of your page:

Code:
<script type="text/javascript">
	var day = new Date().getHours();

	var imageUrl = '1st.jpg';

	if (hour >= 4 && hour < 12) {
		imageUrl = '2nd.jpg';
	} else if(hour >= 12 && hour < 18) {
		imageUrl = '3rd.jpg';
	} else if (hour >= 18 && hour < 24) {
		imageUrl = '4th.jpg';
	}
	
	window.onload = function() {
		document.body.style.background = 'white url(' + imageUrl + ')';
	}
</script>

I would also set the colour to black in your CSS, as that's done regardless of the hour, so doesn't need to be in the JS.

Also take Greg's advice.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top