Jump to content

HTML Time and Date

Jimbillroo Digital

use ntp servers and use a get request and query it every second.

PEWDIEPIE DONT CROSS THAT BRIDGE

 

 

Link to comment
Share on other sites

Link to post
Share on other sites

can i see the code you have already?

I  have GameServer`s And VOIP servers the only price is that you have fun on them. 

Link to comment
Share on other sites

Link to post
Share on other sites

Hello,

So, I am working on this project (I am trying to make a clock I can load up on a screen in the morning) and no matter how many times I try and make the code work I can't get it to work. What I am trying to do is make a digital clock with the date below, like this:

 

attachicon.gifconcept.png

 

Can you help me with this? If you could suggest some code for me to use, that would be great. I have already sorted out the squares, background and ticker, I just need help with the clock and date.

 

Thanks in advance.

You would probably use something like Javascript for a project like this.

Just Google something like "Javascript web clock"

"We're all in this together, might as well be friends" Tom, Toonami.

 

mini eLiXiVy: my open source 65% mechanical PCB, a build log, PCB anatomy and discussing open source licenses: https://linustechtips.com/topic/1366493-elixivy-a-65-mechanical-keyboard-build-log-pcb-anatomy-and-how-i-open-sourced-this-project/

 

mini_cardboard: a 4% keyboard build log and how keyboards workhttps://linustechtips.com/topic/1328547-mini_cardboard-a-4-keyboard-build-log-and-how-keyboards-work/

Link to comment
Share on other sites

Link to post
Share on other sites

Yes, I have done that but I struggled trying to get the font right and I can't seem to get the time and date to display on the page at the same time..

WHat do you have already?

And are you using CSS?

"We're all in this together, might as well be friends" Tom, Toonami.

 

mini eLiXiVy: my open source 65% mechanical PCB, a build log, PCB anatomy and discussing open source licenses: https://linustechtips.com/topic/1366493-elixivy-a-65-mechanical-keyboard-build-log-pcb-anatomy-and-how-i-open-sourced-this-project/

 

mini_cardboard: a 4% keyboard build log and how keyboards workhttps://linustechtips.com/topic/1328547-mini_cardboard-a-4-keyboard-build-log-and-how-keyboards-work/

Link to comment
Share on other sites

Link to post
Share on other sites

Whenever I insert them I can never change the formatting on one of them alone. And only one comes up at a time.

 

try something like this:

<script type="text/javascript">            var tday=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");            var tmonth=new Array("January","February","March","April","May","June","July","August","September","October","November","December");            function GetDate(){                var d=new Date();                var nday=d.getDay(),nmonth=d.getMonth(),ndate=d.getDate();                return tday[nday] + ", " + ndate + " " + tmonth[nmonth];            }            function GetClock(){                var d=new Date();                var nhour=d.getHours(),nmin=d.getMinutes(),ap;                if(nhour==0){ap=" AM";nhour=12;}                else if(nhour<12){ap=" AM";}                else if(nhour==12){ap=" PM";}                else if(nhour>12){ap=" PM";nhour-=12;}                if(nmin<=9) nmin="0"+nmin;                return nhour + ":" + nmin + ap;            }            window.onload=function(){                var update = function(){                    document.getElementById("clockbox").innerHTML = GetDate() + " .... " + GetClock();                };                update();                setInterval(update,1000);            }        </script>        <div id="clockbox"></div>
Link to comment
Share on other sites

Link to post
Share on other sites

Here you go:

<!DOCTYPE html><html>	<head>	</head>	<body>		<script type="text/javascript">			tday=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");			tmonth=new Array("January","February","March","April","May","June","July","August","September","October","November","December");			function getDate(){				var d=new Date();				var nday=d.getDay(),nmonth=d.getMonth(),ndate=d.getDate();				document.getElementById('datebox').innerHTML=""+tday[nday]+", "+ndate+" "+tmonth[nmonth];			}			function getClock(){				var d=new Date();				var nhour=d.getHours(),nmin=d.getMinutes(),ap;			    if(nhour==0){ap=" AM";nhour=12;}				else if(nhour<12){ap=" AM";}				else if(nhour==12){ap=" PM";}				else if(nhour>12){ap=" PM";nhour-=12;}				if(nmin<=9) nmin="0"+nmin;				document.getElementById('clockbox').innerHTML=""+nhour+":"+nmin+ap+"";			}			window.onload=function(){				getDate();				getClock();				setInterval(getDate,1000);				setInterval(getClock,1000);			}		</script>		<font size="7" face="elementary sf" color="white">			<div id="clockbox"></div>		</font>		<br />		<font size="5" face="elementary sf" color="white">			<div id="datebox"></div>		</font>	</body></html>

The reason your date and time never worked together is because they both use the same function name and make use of the same div.

 

So when you tried to use GetClock() the browser will either ignore it due to two existing or pick one of them. So to rectify this I have changed the date function to getDate() and then in a single window.onload function I call both getDate() and getClock().

 

I also created a second div for the Javascript with the id datebox to put the date. If they both put their output into the same div you would only see one at a time.

Link to comment
Share on other sites

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×