JavaScript - Timer on the Same Line

+3 Robert Summers · October 27, 2014
How do I get the timer to stay on the same line in the same place so it doesn't act like: 19:06:1319:06:1419:06:15 not using any <br/> and/or <hr/>?


<!DOCTYPE html>
<html lang="en">

<head>
<meta http-equiv="Content-Type" type="text/html" charset="utf-8">
<title>Robert's Website</title>
<script type="text/javascript">

function printTime(){
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
document.write(hours + ":" + minutes + ":" + seconds);
}
setInterval("printTime()", 1000);

</script>
</head>
<body>
</body>

</html>

Thank you for your help in return :)

Post a Reply

Replies

Oldest  Newest  Rating
+1 Phillip Drake · October 28, 2014
You can do the following to get it to print on just one line: 


<html lang="en">

<head>
<meta http-equiv="Content-Type" type="text/html" charset="utf-8">
<title>Robert's Website</title>
<script type="text/javascript">

function printTime(){
var panel = document.getElementById("panel");  //  new code
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
panel.innerHTML = hours + ":" + minutes + ":" + seconds;  //  modified code
}
setInterval("printTime()", 1000);

</script>
</head>
<body>
<div id="panel"></div>  <!-- new code  -->
</body>

</html>
+1 Phillip Drake · October 28, 2014
In order to get your minutes to add the zero before the minutes which are below ten, you would use an "if statement" to add the zero if the minutes are below 10.  To convert from 24 hour time, you would use the same "if statement" to subtract 12 from the hours.
0 Robert Summers · October 28, 2014
Okay here is another question, How do you get it from 

7:8:59 to 07:08:59


And how do you change from military time to non military time so after 12:59:59 it displays 01:00:00

Thanks for your help in return
0 Sochima Biereagu · January 10, 2015
<script type="text/javascript">
function printTime(){
var panel =
document.getElementById("panel");
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
panel.innerHTML = ((hours<12)?"0"+hours: hours) + ":" + minutes + ":" + seconds;
}
setInterval("printTime()", 1000);
</script>
0 Jay Deshaun · January 10, 2015
Everything you need:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" type="text/html" charset="utf-8">
<title>Robert's Website</title>
<script>
function printTime(){
var panel = document.getElementById("panel");  //  new code
var now = new Date();
var time = [now.getHours(),now.getMinutes(),now.getSeconds()];
if(time[0]>12)
time[0] = time[0] - 12;//Convert from military to non military
panel.innerHTML = ((time[0]<12)? "0"+time[0] : time[0]) + ":" + minutes + ":" + seconds;  //  modified code
}
setInterval("printTime()", 1000);
</script>
</head>
<body>
<div id="panel"></div>
</body>
</html>
  • 1

Javascript

124,584 followers
About

A scripting language that is added to standard HTML to create interactive effects, apps, games for the browser.

Links
Moderators