Código de JavaScript - Simple Cronometro en javascript

Imágen de perfil

Simple Cronometro en javascriptgráfica de visualizaciones


JavaScript

estrellaestrellaestrellaestrellaestrella(3)
Publicado el 30 de Septiembre del 2014 por Xavi
20.150 visualizaciones desde el 30 de Septiembre del 2014. Una media de 147 por semana
Simple cronometro en JavaScript que permite iniciar y parar el tiempo.

Versión 1
estrellaestrellaestrellaestrellaestrella(3)

Publicado el 30 de Septiembre del 2014gráfica de visualizaciones de la versión: Versión 1
20.151 visualizaciones desde el 30 de Septiembre del 2014. Una media de 147 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 (3)

Peppeprox24
18 de Enero del 2017
estrellaestrellaestrellaestrellaestrella
Hola tengo una pregunta. ¿Como hago para que se inicie al entrar a la pagina?
Responder
jose
23 de Enero del 2017
estrellaestrellaestrellaestrellaestrella
con la función "onload". <body onload="funcion">
Responder
Jorge Luis
18 de Marzo del 2017
estrellaestrellaestrellaestrellaestrella
Como podria ahcer para que me cabie de pagina en digamos 3 minutos
Responder

Comentar la versión: Versión 1

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

http://lwp-l.com/s2774