|
JavaScript - Javascript Official Time/internet Clock
hello all, this is my first time on this site and i can usally find all the information i need on google. However iv run into a problem while coding a countdown timer for students in my school i will be hosting it as a mobile website. what im having problems with is getting not the system time, but 1 syncronized time source ex. The official U.S.time or any other single time source if that one will not be the best. any suggestions?
ps. i am completely new to js so make any suggestions and please explain throughly. Thanks! Similar TutorialsHello, I want to change time format from 12 to 24 hours and remove AM and PM in this script. Anybody can help me? Code: <style type="text/css">
/*<![CDATA[*/
#clock {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:16px;
color:#030;
padding-top: 24px;
text-align:center;
}
/*//]]>*/
</style>
<script type='text/javascript'>
//<![CDATA[
var dayarray=new Array('Svē','Pir','Otr','Tre','Cet','Pie','Ses');
var montharray=new Array('01','02','03','04','05','06','07','08','09','10','11','12');
function getthedate(){
mydate=new Date();
year=mydate.getUTCFullYear();
day=mydate.getDay();
month=mydate.getMonth();
daym=mydate.getDate();
if(daym<10) {
daym='0'+daym;
}
hours=mydate.getHours();
minutes=mydate.getMinutes();
seconds=mydate.getSeconds();
dn='AM';
if(hours>=12) {
dn='PM';
}
dn='AM';
if(hours>=12) {
dn='PM';
}
if(hours>12){
hours=hours-12;
}
if(hours==0){
hours=12;
}
if(minutes<=9) {
minutes='0'+minutes;
}
if(seconds<=9) {
seconds='0'+seconds;
}
cdate=dayarray[day]+', '+daym+'-'+montharray[month]+'-'+year+', '+hours+':'+minutes+':'+seconds+' '+dn;
document.getElementById('clock').firstChild.nodeValue=cdate;
setTimeout('getthedate()',1000);
}
window.onload=function() {
getthedate();
}
//]]>
</script>
Thanks. How can I draw a cookie where number of chocolate chips represents the number of seconds and the number of bites represents the number of minutes. I want to show the passage of time on a clock that looks like items are being added to the display according to the number of seconds and minutes. Maybe using a mouse input aswell! Please guide.:confused: I use the Processing Software Sorry, I'm new to javascript... . I want to make a switch statement that will display something different depending on the time of day. Once I saw something like getTime (?), but it relied on the user's clock. I know that you would expect me to at least research getTime so that I'm asking about something more specific, but I don't think it's what I need because I want mine to give the same result regardless of the viewer's time zone or how off thier clock is. How can I do this? I only need to know how to get the time; I know how I'm going to do the switch statement. I just wanted to give you some idea of what I meant to to... =)
Can someone help me modify this script be set to a specific Time Zone rather than picking up the time from the local machine? I want it to countdown to 6:00 am EST. http://javascript.internet.com/time-...countdown.html Can anyone tell me what to add where if it is possible? Thank you in advance. Hi everyone, i made this clock and for me in the UK it displays my time, however for people everywhere else in the world it displays their current time, i would like it to display GMTdate only regardless of where you live. any help would be great. below is my code: 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>
thanks Javascript for clock: Code: function showTime (dateObj) {
thissecond=dateObj.getSeconds();
thisMinute=dateObj.getMinutes();
thisHour=dateObj.getHours();
// change thisHour from 24-hour time to 12-hour time by:
// 1) if thisHour < 12 then set ampm to "a.m." otherwise set it to "p.m."
var ampm = (thisHour < 12) ? "a.m." : "p.m.";
// 2) subtract 12 from the thisHour variable
thisHour = (thisHour > 12) ? thisHour - 12 : thisHour;
// 3) if thisHour equals 0, change it to 12
thisHour = (thisHour == 0) ? 12 : thisHour;
// add leading zeros to minutes and seconds less than 10
thisMinute = thisMinute < 10 ? "0"+thisMinute : thisMinute;
thisSecond = thisSecond < 10 ? "0"+thisSecond : thisSecond;
return thisHour + ":" + thisMinute + ":" + thisSecond + ampm;
}
HTML for page: Code: <?xml version="1.0" encoding="UTF-8" ?>
<!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">
<!--
New Perspectives on JavaScript, 2nd Edition
Tutorial 3
Tutorial Case
The Chamberlain Civic Center
Author:
Date:
Filename: ccc.htm
Supporting files: back.jpg, calendar.css, calendar.js, ccc.css, ccc.jpg, logo.gif
-->
<title>The Chamberlain Civic Center</title>
<link href="ccc.css" rel="stylesheet" type="text/css" />
<link href="calendar.css" rel="stylesheet" type="text/css" />
<script src="calendar.js" type="text/javascript"></script>
</head>
<body>
<div id="head">
<script type="text/javascript">
calendar("March 25, 2011");
</script>
<img src="ccc.jpg" alt="Chamberlain Civic Center" />
</div>
<div id="links">
<table><tr>
<td><a href="#">Home</a></td><td><a href="#">Tickets</a></td>
<td><a href="#">Events</a></td><td><a href="#">Tour</a></td>
<td><a href="#">Directions</a></td><td><a href="#">Hours</a></td>
<td><a href="#">Packages</a></td><td><a href="#">Contact Us</a></td>
</tr></table>
</div>
<div id="main">
<p id="firstp"><img src="photo.jpg" alt="" />March is another banner month
at the Chamberlain Civic Center, with performances of the award-winning
musical, <span>The Producers</span> by the Broadway Touring Company on
March 4, 5, and 6. Tickets are going fast, so order yours today.</p>
<p>Celebrate the season on March 11 with the Chamberlain Symphony and their
special selection of classical music with Spring themes. The next day,
March 12, exercise your mind by attending the Charles Dickens mystery
<span>Edwin Drood</span>.</p>
<p>Jazz lovers have a lot to celebrate in March with a visit from <span>The
Jazz Masters</span> on the 17th. Then on March 24, enjoy the music of The
Duke with <span>An Ellington Tribute</span> performed by the Jazz Company
of Kansas City.</p>
<p>Pins, bottles, plates, and chairs are flying at the Chamberlain Civic
Center in March. <span>The Taiwan Acrobats</span> return with another
amazing performance on Sunday, March 13. On March 20, the <span>Madtown
Jugglers</span> get into the act with their unique blend of comedy, juggling,
and madness.</p>
<p>Enjoy a classical brunch every Sunday afternoon with music provided by the
Carson Quartet. Seating is limited, so please reserve your table.</p>
</div>
<address>
The Chamberlain Civic Center ·
2011 Canyon Drive ·
Chamberlain, SD 57325 ·
(800) 555-8741
</address>
</body>
</html>
CSS for page: Code: /*
New Perspectives on JavaScript, 2nd Edition
Tutorial 3
Tutorial Case
Filename: ccc.css
This file contains styles used in the ccc.htm file
*/
body {margin: 0px; background: white url(back.jpg) repeat-y scroll 820px 0px}
#head {width: 750px; height: 150px; padding: 5px}
#links {clear: right; width: 750px; padding: 0px}
#links table {width: 750px; font-family: Arial, Helvetica, sans-serif;
font-size: 8pt; margin: 0px}
#links table td {text-align: center; background-color: white;
border: 1px solid black; letter-spacing: 5; padding: 2px}
#links table a {text-decoration: none; color: rgb(223,29,29); width: 100%}
#links table a:hover {color: white; background-color: rgb(223,29,29)}
#main {width: 750px; font-family: Arial, Helvetica, sans-serif; padding: 10px}
#main p {text-align: justify; font-size: 9pt}
#firstp:first-line {font-variant: small-caps}
#main img {float: right; margin: 0px 0px 10px 10px}
#main p span {color: rgb(223,29,29)}
address {width: 750px; font-size: 8pt; font-style: normal; color: rgb(223,29,29);
font-family: Arial, Helvetica, sans-serif; text-align: center;
border-top: 1px solid rgb(223,29,29); padding-bottom: 10px}
Does anyone know how to put my clock into my HTM and CSS files to have it appear at the top left of the page? Please, help. Thanks. Hello everybody. I need to make a javascript (and only javascript, no php and such) clock, that the hours and the minuets can be updated manually by an html form with 2 fields. I cant find a way to do this. thanks in advance, danbb. I am pretty new to javascript and descided to test my skills by making a javascript clock using the computers time it works but I know the way I am doing it isn't very good you can see the code below Code: <!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">
<head>
<title>clock</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var minutes = 0;
var seconds;
var hour = 0;
var minute = new Date().getMinutes();
minutes += minute;
var hours = new Date().getHours();
hour += hours;
var time_period = "";
if(hour > 12){
hour = hour-12;
time_period = "PM";
}else {
time_period = "AM";
}
function working_clock(){
var time = new Date;
seconds = time.getSeconds();
var clock = document.getElementById('clock');
if(seconds == 59){
minutes+=1;
}
if(minutes == 60){
minutes = 1;
hour++;
}
if(minutes < 10){
var minute_digit_two = 0;
clock.innerHTML = ("time: "+hour+":"+minute_digit_two +minutes+":"+seconds+" "+time_period);
}else {
clock.innerHTML = ("time: "+hour+":"+minutes+":"+seconds+" "+time_period);
}
setTimeout("working_clock()",1000);
}
window.onload = working_clock;
</script>
</head>
<body>
<div id="clock"></div>
</body>
</html>
heres where you can see it in action http://the-test.comoj.com/files/working-clock.html im just asking if there are any errors or if theres a better way to do this I'm trying to convert A world Population Counter from Flash into HTML/Javascript. But I'm having difficulties and It would be great if someone can help me out. The sample show a analog clock, But the html version I want should use just a digital clock, it's simpler I think http://www.webstylelabs.com/worldclock2.swf http://www.webstylelabs.com/actionscript.txt Here is my code, http://www.webstylelabs.com/clock.html So just plain input digital counter is ok I appreciate any help Thanks for clicking on the link and i presume while you are here on my thread yo u will try to help me So here is the situation. I am building webpage that displays a clock , a ticker box and a countdown(alarm clock). I have found many previously coded alarm clocks/countdown timers but they dont do what i need. Then what do you need you might be asking yourself?! - I need a countdown timer with background in MySQL database(there will be multiple events in that database) and then checks which is the next one( Alarms will be in HH:MM format so they can be activated every day), after the check it displays a countdown(logical eh?) until that event - when it reaches that event it should redirect to some other site(which will return user to the same site after 15 min pause) and then All over again, check which is next, countdown , redirect , AGAIN This website is designed not to be clicked or anything - it should work by itself. Are YOU able to help me? (Just a fair warning - Im a newb in javascript so dont be too harsh on me) WYSIWYG editor for PHPBB3. As far as I'm aware only unofficial MODS exist, and one has the impression they are fraught with bugs. I need a polished free opensource solution. I was really hopeful there was an official WYSIWYG, but I haven't found it yet if there is one. Can anyone confirm? 1 down vote favorite I do have the countdown script (see link below) to display the time between current time and the date given in real-time. However, I want to achieve to display the time difference between a given start and end time. Right now, it calculates from the current server time to the end time. I want to be able to set up my own start time and end time. Here is what I have: http://jsfiddle.net/BgEtE/ thank you for help Hi, I have a webpage with a world clock. On the clock page are 12 buttons (World Cities). When the user clicks these buttons. The time for the relevant world city is displayed. (The time is updated by an on.click function for each individual button. That either subtracts or adds the hours from GMT. For example. If the time is GMT 18:00:00. The user clicks the Paris button and the function adds 1 hour to result in 19:00:00) However. If the GMT time is for example 21:00:00 and the user clicks the Tokyo button (GMT+9 hours). The time displayed is 30:00:00. So I have been trying to work out how I can stop the time adding past 23:59:59. This is probably so simple which is probably why I cant find any help online. It has stumped me and any help would be appreciated. I have copied and pasted my code below in the hope that helps. Thanks in advance if you can offer any advice. Code: <script>
function start() {
GMToffset = 0;
t=setInterval('digitalclock()',500);
}
function digitalclock()
{
var today=new Date();
var hours=today.getHours() + GMToffset;
var minutes=today.getMinutes();
var seconds=today.getSeconds();
minutes=checkTime(minutes);
seconds=checkTime(seconds);
hours=checkTime(hours);
document.getElementById('txt').innerHTML=hours+":"+minutes+":"+seconds;
}
function checkTime(i)
{
if (i<10)
{
i="0" + i;
}
return i;
}
function updatetime1() {
GMToffset = -3;
}
function updatetime2() {
GMToffset = -4;
}
function updatetime3() {
GMToffset = -7;
}
function updatetime4() {
GMToffset = -10;
}
function updatetime5() {
GMToffset = -11;
}
function updatetime6() {
GMToffset = -13;
}
function updatetime7() {
GMToffset = +9;
}
function updatetime8() {
GMToffset = +8;
}
function updatetime9() {
GMToffset = +7;
}
function updatetime10() {
GMToffset = +1;
}
function updatetime11() {
GMToffset = +0;
}
function updatetime12() {
GMToffset = +3;
}
</script>
<div align="center">
<input type="button" onclick="updatetime1()" value="Time in Buenos Aires" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime2()" value="Time in New York" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime3()" value="Time in San Francisco" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime4()" value="Time in Hawaii" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime5()" value="Time in Fiji" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime6()" value="Time in Sydney" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br><br>
<body onload="start()">
<div id="txt"></div>
</div>
<div align="center">
<input type="button" onclick="updatetime7()" value="Time in Tokyo" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime8()" value="Time in Hong Kong" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime9()" value="Time in Bangkok" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime10()" value="Time in Rome" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime11()" value="Time in London" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime12()" value="Time in Moscow" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
hi everyone, I hope you can help me understand why my Javascript menu is different on Chrome browser. It is fine on Internet Explorer. Please see images. Internet Explorer Google Chrome I look forward to hearing from you. Ravi I've got a flash music player (audioplay) on a site (yeah, I know, I hate music on websites too, but the client wants it). I'm using javascript to trigger "stop" and "play" and it works on every browser except IE 9+. The error in IE's developer says: SCRIPT438: Object doesn't support property or method 'stopMusic' Here's the javascript: Code: <script language="JavaScript" type="text/javascript">
function getPlayer(movieName)
{
if (navigator.appName.indexOf("Microsoft") != -1)
{
return window[movieName];
}
else
{
return document[movieName];
}
}
function play2()
{
getPlayer('player2').playMusic();
}
function stop2()
{
getPlayer('player2').stopMusic();
}
</script>
Here's the working example: EXAMPLE Hey everyone, this problem has been bothering me for awhile, so I decided to finally stop banging my head against a wall over it and seek out some help. I'm fairly new to web development, but through W3Schools and the almighty Google, I managed to make my way through developing a site for the company that I intern for. The site is designed to query a Microsoft Access database and display the results, so employees can see the results of tests run on another machine in a different area. I did not design the database or queries for this project, but assume that they function as they are supposed to. The way the website works is by displaying a form to the user with a number of check boxes (it varies by page) that each add another parameter to the query. When the query button is clicked, I used the "onclick" action of an HTML button to send the form data to a JavaScript function to be processed. The JavaScript function filters out what I need to send to a php page that runs the query. I send the information from the JavaScript function using an XMLHttpRequest, and replace a line of text in the HTML document with the returned results from the php script. I have tested the completed website in several browsers. It works flawlessly in Chrome, Firefox, and IE9. The problem is, it doesn't work with IE7 or IE8, and even though the company I work for is making a widespread upgrade to Windows 7 from XP within the year, they don't plan on moving beyond IE8. When I load the page in IE8 (I'm running WAMP as my server), I can see that my php scripts work just fine, because some of the fields used to configure the query are generated using php, and they appear as they should. However, when I click the form button that triggers the JavaScript function, nothing happens (IE7 and 8 both report "Error on Page"). I've gone through nearly every Internet Options settings, as far as I know, and I'm fairly certain that every setting related to scripting is enabled, though I've only tried testing the site on IE7 and 8 at work and not at home (where I have unlimited security access). Below is the HTML for the button that triggers the JavaScript function, "displayTable": Code: <input type="button" name="button" value="Show Results" onclick="displayTable(this.form)" /> I'm not sure how easily this problem can be fixed, so if anyone needs to see any other bits of code, I can provide those. But my main question is, does this sound like just some setting in IE7/8 that I don't know about (keeping in mind that, with all the settings the same, the site works fine in IE9), or does IE7/8 simply have some inherent flaw in interpreting JavaScript, and will it be necessary for me to rewrite my code taking some other approach, and if so, what language would be recommended in place of JavaScript in IE7/8? Thanks! Hello, I'm new to Javascript programming. I have designed a Javascript to carry information from one page to another. It works fine in firefox but does not work in internet explorer. Is there some coding that needs to be specified for my script to work in ie? Thanks Hello, im new and hope you can help me out. I am running some javascript on my vbulletin forum. One is for some ad network to display ads, I noticed this working in firefox and chrome but not IE. After some investigation I realised my analytics javascript snippet is conflicting, if i remove the javascript for my analytics then the ads show in all web browsers. The two pieces of code a Analytics; Code: <script src="/mint/?js" type="text/javascript"></script> Ad network; Code: <script type="text/javascript"> var EB_campid='5336510241'; </script> <script src="http://www.zintext.com/showads.js" type="text/javascript"></script> Any help appreciated. Dave. when this page is viewed in IE (8), IE tells me there's an error on the page. Quote: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Win64; x64; Trident/4.0) Timestamp: Tue, 17 May 2011 14:29:31 UTC Message: Invalid argument. Line: 7 Char: 17603 Code: 0 URI: http://cpanel4.frontline.net/~ggarch...cufon/cufon.js Here's what that Javascript file looks like: http://pastebin.com/T2vgugm2 I honestly know very little about Javascript. I installed a wordpress theme that already contained this bit of Javascript so please be patient with me on this one. please advise. thanks in advance! |
|||||||