JavaScript:Tutorial, Digital Clock

**TcM** · #1 (**permalink**) 12-02-2006, 08:22 AM

Introduction:-
This is my second tutorial and I will show you how to get the Time in a Text Box.. perhaps in a Text Box it will be useless, but it could be used in other instances!

Solution:-
This code goes in the <head> tags:-

Code:

<script language="JavaScript">

var timerID = null;
var timerRunning = false;

function stopclock (){
        if(timerRunning)
                clearTimeout(timerID);
        timerRunning = false;
}

function showtime () {
        var now = new Date();
        var hours = now.getHours();
        var minutes = now.getMinutes();
        var seconds = now.getSeconds()
        var timeValue = hours
        timeValue += ((minutes < 10) ? ":0" : ":") + minutes
        timeValue += ((seconds < 10) ? ":0" : ":") + seconds
        document.clock.face.value = timeValue;
        timerID = setTimeout("showtime()",1000);
        timerRunning = true;
}
function startclock () {
        stopclock();
        showtime();
}

</script>

And this code as the body code:-

Code:

<body onLoad="startclock()">

<form name="clock" onSubmit="0">
  <div align="center"><center><p><input type="text" name="face" size="10" value> </p>
  </center></div>
</form>

Explanation:-
I think its simple without any need of explanation.. but if you have any suggestions/questions just post them here

A Preview:-

Conclusion:-
As Always Feedback is welcome and the full source is attached!!

xtraze · #2 (**permalink**) 01-01-2007, 10:03 AM

Nice, and I am now looking for an Analog clock now. Hope I can find it by Google. I will search tomorrow.

AfTriX · #3 (**permalink**) 01-03-2007, 04:22 AM

Thanks for the code. very useful. Text Box clock idea is good, and pretty simple code.

**TcM** · #4 (**permalink**) 01-03-2007, 06:40 AM

Quote:

Originally Posted by xtraze

Nice, and I am now looking for an Analog clock now. Hope I can find it by Google. I will search tomorrow.

Javascript: Analog Clock

I found this one for you!

AfTriX · #5 (**permalink**) 01-03-2007, 06:46 AM

Seems Tcm9669 continuously digging on JavaScript mats. Nice work and thanks

**TcM** · #6 (**permalink**) 01-03-2007, 07:44 AM

Quote:

Originally Posted by AfTriX

Seems Tcm9669 continuously digging on JavaScript mats. Nice work and thanks

Welcome

I just like JavaScript

AfTriX · #7 (**permalink**) 01-04-2007, 12:05 AM

Quote:

Originally Posted by Tcm9669

Welcome

I just like JavaScript

Nice to here. Keep on improving your skills..

xtraze · #8 (**permalink**) 01-06-2007, 09:42 PM

Thanks for it lol. Nice I will add it as an html mod into a Joomla powered website I'm currently working on.

AfTriX · #9 (**permalink**) 01-07-2007, 02:24 AM

Quote:

Originally Posted by xtraze

Thanks for it lol. Nice I will add it as an html mod into a Joomla powered website I'm currently working on.

Don NOT forget to inform all the CodeCall members to tell about your site once its completed

doosa · #10 (**permalink**) 03-09-2008, 01:59 AM

good script

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

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Creating a Clock	AfTriX	VB Tutorials	1	05-08-2009 10:33 AM
Javascript: Analog Clock	TcM	Javascript	20	05-28-2008 09:01 AM
Creating an analog clock with ActionScript	AfTriX	Tutorials	2	01-07-2007 02:19 AM
Cool LCD Clock	AfTriX	Javascript	2	01-04-2007 01:00 AM

CodeCall

Sponsors

Freelance Jobs

Compare Hosting Plans

CodeCall Goal

Ads

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)