Calificación:
  • 3 voto(s) - 5 Media
  • 1
  • 2
  • 3
  • 4
  • 5

relog analogico java
#1

relog analogico javascript

Código:
<html>
<head>
<title>Reloj analogico</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
    <script language="javascript" type="text/javascript">  
    var navok  
    if ( document.getElementById || document.all )    
        navok = true  
    else  
        navok = false  
      
    //fecha y hora actuales  
    var ahora = new Date()  
      
    //coordenadas posicion numeros en la circulo del Inicializa  
    var circulo_x = new Array()  
    var circulo_y = new Array()  
    circulo_x[7] = [80, 94, 100, 94, 77, 53, 28, 11,  5, 11, 28, 53]  
    circulo_y[7] = [ 8, 26,  50, 74, 91, 97, 91, 74, 50, 26,  8,  2]  
      
    //elementos graficos del Inicializa  
    var horas = new Array()  
    var minutos = new Array()  
    var segundos = new Array()  
    var numeros = new Array()  
      
      
    function dibuja_reloj() {  
          
        //dibuja circulo del Inicializa  
        var txt  
            txt = '<div id="exterior" style="position:relative; width:117px; height:117px; visibility:visible">'  
          
        for(i=1;i<=7;i++)    //minutero  
            txt += '<div id="min'+i+'" style="position:absolute; top:-100px; left:-100px; width:6px; height:6px; background-color:red; font-size:6px;"></div>'  
      
        for(i=1;i<=5;i++)    //horas  
            txt += '<div id="hrs'+i+'" style="position:absolute; top:-100px; left:-100px; width:6px; height:6px; background-color:blue; font-size:6px;"></div>'  
      
        for(i=1;i<=7;i++)    //segundero  
            txt += '<div id="sec'+i+'" style="position:absolute; top:-100px; left:-100px; width:4px; height:4px; background-color:black; font-size:6px;"></div>'  
      
        for(i=1;i<=12;i++)   //digitos  
            txt += '<div id="h'+i+'" style="position:absolute; top:-100px; left:0px; width:10px; height:10px; font-size:10pt; font-family: Arial;">'+i+'</div>'  
      
        txt += '</div>'  
      
        document.write(txt)  
    //  mueve_capa( exterior, 100, 200);  
    }  
      
    //movimiento agujas  
    function avanza_reloj() {  
        ahora = new Date()  
        ahora.hrs = ahora.getHours()  
        ahora.min = ahora.getMinutes()  
        ahora.sec = ahora.getSeconds()  
          
        ahora.hrs = ( ahora.hrs >= 12 ) ? ahora.hrs - 12 : ahora.hrs  
          
        ahora.hrs = Math.floor( ( ahora.hrs * 5 ) + ( ahora.min/12 ) )  
          
        for(n=0;n<horas.length;n++)  
            mueve_capa(horas[n], circulo_x[n][ahora.hrs], circulo_y[n][ahora.hrs])  
        for(n=0;n<minutos.length;n++)  
            mueve_capa(minutos[n], circulo_x[n][ahora.min], circulo_y[n][ahora.min])  
        for(n=0;n<segundos.length;n++)  
            mueve_capa(segundos[n], circulo_x[n][ahora.sec], circulo_y[n][ahora.sec])  
    }  
      
    function mueve_capa(id,x,y){  
        id.style.left = x + 'px'  
        id.style.top = y + 'px'  
    }  
      
      
    function obtiene_capa(idstr) {  
        if (document.getElementById)  
            return document.getElementById(idstr)  
        else if (document.all)  
            return document.all[idstr]  
    }  
      
      
    function Inicializa() {  
          
        if ( !navok )  
            return  
          
        //array de objetos aguja horas  
        for( i=1; i<=5; i++)  
            horas[i-1] = obtiene_capa('hrs'+i)  
        //array objetos minutero  
        for( i=1; i<=7; i++)  
            minutos[i-1] = obtiene_capa('min'+i)  
        //array objetos segundero  
        for( i=1; i<=7; i++)  
            segundos[i-1] = obtiene_capa('sec'+i)  
        //array objetos numeros circulo      
        for( i=1; i<=12; i++)  
            numeros[i] = obtiene_capa('h'+i)  
        
        //inicializa posicion numeros circulo  
        for( n=1; n<=12; n++)  
            mueve_capa(numeros[n], circulo_x[7][n-1], circulo_y[7][n-1])  
        
        var centro = [0]  
        var radio = 6  
        var resultado = new Array()  
        for( i=1; i<=60; i++) {  
            centro[i] = centro[i-1] + ((Math.PI*2)/60)  
            centro[i-1] += Math.PI/180  
        }  
        
        for( num=0; num<=6; num++) {  
            circulo_x[num] = new Array()  
            circulo_y[num] = new Array()  
            for( i=1; i<=60; i++) {  
                resultado = ((i-15)<0)? 60 + i - 15 : i - 15  
                circulo_x[num][i] = Math.floor((num*radio*Math.cos(centro[resultado]))+56)  
                circulo_y[num][i] = Math.floor((num*radio*Math.sin(centro[resultado]))+55)  
            }  
            circulo_x[num][0]=circulo_x[num][60]  
            circulo_y[num][0]=circulo_y[num][60]  
        }  
        
        var IdIntervalo = setInterval("avanza_reloj()", 100)  
    }  
      
      
    window.onload = Inicializa  
      
      
    </script>  
<body>

    
    <script type="text/javascript">  
    dibuja_reloj()  
    </script>  
</body>
</html>

Smile5
Responder
Gracias dado por: porsiempre


Salto de foro:


Usuarios navegando en este tema: 1 invitado(s)