The time now is...

Quark · #1 06-13-2008, 05:42 AM

This is just a little something that has been on my mind. You know the clock at the bottom of the page? Would it be possible to have the time updated without having to refresh the page?

Zardoz · #2 06-13-2008, 05:50 AM

Great suggestion!!

Jed Starkiller · #3 06-13-2008, 06:40 AM

It seems to me that it should be possible with small java script... Programming my weak spot though.

Zardoz · #4 06-13-2008, 07:03 AM

Quote:

Originally Posted by Jed Starkiller

It seems to me that it should be possible with small java script... Programming my weak spot though.

Same here.

Chris Fawkes · #5 06-13-2008, 09:11 AM

Quote:

Originally Posted by Jed Starkiller

It seems to me that it should be possible with small java script... Programming my weak spot though.

What is your specialty.

Hey do you build sites?

Jed Starkiller · #6 06-13-2008, 10:39 AM

Chris I have done some before. Why whats up?

Deusdies · #7 06-13-2008, 11:23 AM

Here are some:

Code:

<script type="text/javascript">
<!--

function updateClock ( )
{
  var currentTime = new Date ( );

  var currentHours = currentTime.getHours ( );
  var currentMinutes = currentTime.getMinutes ( );
  var currentSeconds = currentTime.getSeconds ( );

  // Pad the minutes and seconds with leading zeros, if required
  currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
  currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

  // Choose either "AM" or "PM" as appropriate
  var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";

  // Convert the hours component to 12-hour format if needed
  currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;

  // Convert an hours component of "0" to "12"
  currentHours = ( currentHours == 0 ) ? 12 : currentHours;

  // Compose the string for display
  var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;

  // Update the time display
  document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}

// -->
</script>

You will have to edit footer in your vBulletin template. Styles > Edit Template > Footer.

Now this is also necessary:

Code:

<body onload="updateClock(); setInterval('updateClock()', 1000 )">

Add this in header template. Beware not to rewrite whole <body> tag; there might be something put by vBulletin.

Of course, you will have to add custom CSS classes to clock JavaScript. You don't want it to be plain xD

Jed Starkiller · #8 06-13-2008, 11:27 AM

See I knew it was easy!

Zardoz · #9 06-13-2008, 11:47 AM

Quote:

Originally Posted by Jed Starkiller

See I knew it was easy!

Easy as nuclear fission!

Jed Starkiller · #10 06-13-2008, 12:50 PM

A bit harder than Astrophysic's with a minor in worm hole theory.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode