Hola...
Voy a poner primero el fichero de los iframes:
Código PHP:
<html>
<head>
<script language=javascript>
function poner(sitio, dato) {
document.getElementById(sitio).setAttribute("value", dato);
}
function cambiar(ini, fin) {
var _ini = document.getElementById(ini);
var _fin = document.getElementById(fin);
_ini.disabled = (_ini.disabled == true) ? false : true;
_fin.disabled = (_fin.disabled == true) ? false : true;
}
</script>
</head>
<body style="text-align: center">
<iframe src=prueba45bis3.html name=reloj1 style="width:1; height:1; visibility: hidden"></iframe>
<input type=text size=2 id=h1 value="00" style="border: none">:
<input type=text size=2 id=m1 value="00" style="border: none">:
<input type=text size=2 id=s1 value="00" style="border: none"><br>
<button id=ini1 onclick="reloj1.iniciaReloj('h1', 'm1', 's1'); cambiar('ini1', 'fin1')">Empezar</button>
<button id=fin1 onclick="reloj1.detieneReloj(); cambiar('ini1', 'fin1')" disabled>Congelar</button>
<button onclick="reloj1.mostrando('h1', 'm1', 's1')">Estado</button>
<button onclick="reloj1.inicio('h1', 'm1', 's1')">Inicializar</button>
<br>
<iframe src=prueba45bis3.html name=reloj2 style="width:1; height:1; visibility: hidden"></iframe>
<input type=text size=2 id=h2 value="00" style="border: none">:
<input type=text size=2 id=m2 value="00" style="border: none">:
<input type=text size=2 id=s2 value="00" style="border: none">
<br>
<button id=ini2 onclick="reloj2.iniciaReloj('h2', 'm2', 's2'); cambiar('ini2', 'fin2')">Empezar</button>
<button id=fin2 onclick="reloj2.detieneReloj(); cambiar('ini2', 'fin2')" disabled>Congelar</button>
<button onclick="reloj2.mostrando('h2', 'm2', 's2')">Estado</button>
<button onclick="reloj2.inicio('h2', 'm2', 's2')">Inicializar</button>
</body>
</html>
Fíjate que los rejojes están separados por el tag br, y que son cosas iguales, donde solo tienes que cambiar el número ...
en este caso el primero tiene todo a 1, y el segundo a 2...
Y ahora pongo el iframe (ponle los nombres que a ti te parazca mejor...
Código PHP:
<html>
<head>
<script language="javascript" >
var minutero = 0;
var segundero = 0;
var horario = 0;
var activo = false;
var win = false;
function ajuste(n) {
var salida = "";
if (n < 10) salida = "0" + n ;
else salida = "" + n;
return salida;
}
function iniciaReloj(h, m, s) {
if (win) {win.close(); win = false}
parent.poner(s, ajuste(segundero));
parent.poner(m, ajuste(minutero));
parent.poner(h, ajuste(horario));
activo = true;
var empezar = "ponSegundero('" + h + "', '" + m + "', '" + s + "')";
setTimeout(empezar, 1000);
}
function detieneReloj() {
activo = false;
}
function mostrando(h, m, s) {
if (win) {
win.close(); win = false; iniciaReloj(h, m, s);
}
else {
detieneReloj();
var contenido = "<html><body>";
contenido += ajuste(horario) + ":" + ajuste(minutero) + ":" + ajuste(segundero) + "</body></html>";
win = window.open("", "", "width=100,height=5");
win.document.write(contenido);
}
}
function ponSegundero(h, m, s) {
if (activo) {
if (++segundero > 59) {
ponMinutero(h, m);
segundero = 0;
}
parent.poner(s, ajuste(segundero));
var seg = "ponSegundero('" + h + "', '" + m + "', '" + s + "')";
setTimeout(seg, 1000);
}
}
function ponMinutero(h, m) {
if (++minutero > 59) {
ponHora(h);
minutero = 0;
}
parent.poner(m, ajuste(minutero));
}
function ponHora(h) {
if (++horario > 23) horario = 0;
parent.poner(h, ajuste(horario));
}
function inicio(h, m, s) {
minutero = 0;
segundero = 0;
horario = 0;
parent.poner(h, "00");
parent.poner(m, "00");
parent.poner(s, "00");
}
</script>
</head>
<body style="text-align: center"></body>
</html>
Pruébalo y si no entiendes algo, te lo explicaré.
saludos
