Display object on page in a different location based on time of day

I'm looking at placing an object on a page in a different position based upon ti开发者_StackOverflow中文版me of day. Specifically, I would like to have an image of the sun on the page. I would like it to move across the page based upon what time of day it is for the user. Any ideas or suggestions? It's probably been done before I imagine. I tried googling it and found some really really old results but nothing recent.

Use absolute positioning: position: absolute; in CSS, with top: ___; and left: ___; properties to position the object on the page.

You can change those properties easily using JavaScript. Since you tagged your question as using jQuery, you could use simply $(foo).css({left: ___, top: ___});

And of course, JavaScript's Date object can give you information about the current date and time.

Interesting idea.. +1 VoteyDisciple, I just decided to write a small mock up on it.

new Date() returns date/time for the local machine.

var date = new Date();

var hour = date.getHours();

if (hour == 0) { // when it's 12:00am
   $(foo).css({left: ___, top: ___}); // fill in position
   $(foo2).css({left: ___, top: ___}); // fill in position

} else if (hour == 1) { // when it's 1:00am
   $(foo).css({left: ___, top: ___}); // fill in position
   $(foo2).css({left: ___, top: ___}); // fill in position

} else if (hour == 2) { // when it's 2:00am

} ......

Just a simple thought how to get this going.. You can position other elements depending on the hour of the day as well.