Everhard / stopwatch.js

This is a simple and lightweight library, that adds a stopwatch with an API to an HTML page.

stopwatch.js

This is a simple and lightweight library, that adds a stopwatch to an HTML page.

Here's a demo.

How to install

Just include the library into your HTML page:

<script src="js/stopwatch.js"></script>

How to use

Add some block element to your HTML and give it some ID:

<div id="stopwatch"></div>

Now create a StopWatch object using an ID as a parameter:

var stopWatch = new StopWatch("stopwatch");

That's it! Now your DOM was changed to the next structure:

<div id="stopwatch">
    <span class="days">00</span>
    <span class="hours">00</span>
    <span class="minutes">00</span>
    <span class="seconds">00</span>
    <span class="milliseconds">000</span>
</div>

And you can customize the appearance whatever you like using CSS.

Control

Method	Description
stopWatch.start()	Start a stopwatch.
stopWatch.pause()	Pause a stopwatch.
stopWatch.stop()	Stop a stopwatch.

Properties

Properties	Description
stopWatch.milliseconds	The value of the milliseconds part.
stopWatch.seconds	The value of the seconds part.
stopWatch.minutes	The value of the minutes part.
stopWatch.hours	The value of the hours part.
stopWatch.days	The value of the days part.
stopWatch.isRunning	Set to true when a stopwatch is running.
stopWatch.isPaused	Set to true when a stopwatch is paused.