index.html

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Timetator Plugin</title>
	<style>
		body {
			font-family: sans-serif;
			margin: 0;
			padding: 0;
		}
		#wrapper {
			padding: 15px;
		}
		label {
			font-weight: bold;
			padding-top: 16px;
			display: block;
		}
		input {
			padding: 5px;
			font-size: 20px;
		}
	</style>
	<script src="jquery-1.11.0.min.js"></script>
	<script src="fm.timetator.jquery.js"></script>
	<script>
		$(function () {
			$('#inputTimetator1').timetator();

			$('#inputTimetator2').timetator({
				useCap: false
			});

			$('#inputTimetator3').timetator({
				seperator: '.',
				useSeconds: true
			});
		});
	</script>
</head>
<body>
	<div id="wrapper">
		<label for="inputTimetator1">default</label>
		<input id="inputTimetator1" value=""><br>
		<br>
		<label for="inputTimetator2">useCaps: false</label>
		<input id="inputTimetator2" value="14:00"><br>
		<br>
		<label for="inputTimetator3">seperator: '.' and useSeconds: true</label>
		<input id="inputTimetator3" value="01.15"><br>
		<br>
		<label for="inputTimetator4">Markup initialization</label>
		<pre>&lt;input class=&quot;timetator&quot; value=&quot;01:15&quot; data-timetator-use-cap=&quot;false&quot;&gt;</pre>
		<input class="timetator" id="inputTimetator4" value="01:15" data-timetator-use-cap="false"><br>
	</div>

</body>
</html>