Código de JavaScript - Simple Cronometro en javascript

Imágen de perfil

Simple Cronometro en javascriptgráfica de visualizaciones


JavaScript

Publicado el 30 de Septiembre del 2014 por Xavi
15.312 visualizaciones desde el 30 de Septiembre del 2014. Una media de 140 por semana
Simple cronometro en JavaScript que permite iniciar y parar el tiempo.

Versión 1

Publicado el 30 de Septiembre del 2014gráfica de visualizaciones de la versión: Versión 1
15.313 visualizaciones desde el 30 de Septiembre del 2014. Una media de 140 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

Puedes ver un ejemplo aquí
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
    <title>Simple Cronometro en javascript</title>
    <meta name="title" content="Cronometro en javascript">
    <meta name="description" content="Cronometro en javascript">
    <meta name="keywords" content="código,cronometro,javascript">
 
	<script>
	var inicio=0;
	var timeout=0;
 
	function empezarDetener(elemento)
	{
		if(timeout==0)
		{
			// empezar el cronometro
 
			elemento.value="Detener";
 
			// Obtenemos el valor actual
			inicio=vuelta=new Date().getTime();
 
			// iniciamos el proceso
			funcionando();
		}else{
			// detemer el cronometro
 
			elemento.value="Empezar";
			clearTimeout(timeout);
			timeout=0;
		}
	}
 
	function funcionando()
	{
		// obteneos la fecha actual
		var actual = new Date().getTime();
 
		// obtenemos la diferencia entre la fecha actual y la de inicio
		var diff=new Date(actual-inicio);
 
		// mostramos la diferencia entre la fecha actual y la inicial
		var result=LeadingZero(diff.getUTCHours())+":"+LeadingZero(diff.getUTCMinutes())+":"+LeadingZero(diff.getUTCSeconds());
		document.getElementById('crono').innerHTML = result;
 
		// Indicamos que se ejecute esta función nuevamente dentro de 1 segundo
		timeout=setTimeout("funcionando()",1000);
	}
 
	/* Funcion que pone un 0 delante de un valor si es necesario */
	function LeadingZero(Time) {
		return (Time < 10) ? "0" + Time : + Time;
	}
	</script>
 
	<style>
	.crono_wrapper {text-align:center;width:200px;}
	</style>
</head>
 
<body>
<?php
include($_SERVER['DOCUMENT_ROOT']."/inc/headerCode.inc.php");
?>
 
<h1>Simple Cronometro en javascript</h1>
 
<div class="crono_wrapper">
	<h2 id='crono'>00:00:00</h2>
	<input type="button" value="Empezar" onclick="empezarDetener(this);">
</div>
 
<p>Puedes ver el código fuente en <a href="http://lwp-l.com/s2774">http://lwp-l.com/s2774</a></p>
 
<?php
include($_SERVER['DOCUMENT_ROOT']."/inc/footerCode.inc.php");
?>
 
</body>
</html>



Comentarios sobre la versión: Versión 1 (0)


No hay comentarios
 

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s2774