Javascript - Relogio Basico

Primeiro, eu não vou postar diretamente, por nao ter muito tempo kk.

Segundo, vamos ao codigo:

*Você pode usar esse codigo em Widgets HTML\JAVASCRIPT.

HTML:

  Explicações para personalizar:
  color:#000000; /* #000000 = rgb(0, 0, 0) preto. voce pode usar o color picker do paint, e ao invez de usar #000000 use rgb(R, G, B) ex: rgb(255,0,0) vermelho. */
  Como usar o ColorPicker do paint:

   (Clique Para Expandir).

  Explicação Da Imagem:

    no lugar de #CODIGO DA COR, use o codigo rgb(VERMELHO, VERDE, AZUL), Exemplo: rgb(0, 70, 0);

font-size:12px; /* O tamanho da fonte do texto do seu relogio, no caso 12px. */

font-family:Arial; /* O nome da fonte do texto do seu relogio, não recomendo alterar muito, recomendo deixar uma fonte que todo mundo tenha no pc. */

font-weight:normal; /* a weight da fonte, clique aqui para ver a documentação sobre essa tag */

font-style:normal; /* o estilo da fonte, italic, normal, oblique, inherit */

text-decoration:none; /* a decoração do texto, (none, underline, overline, line-through, blink, inherit) */

id="basicclock" Não altere essa parte, pois senão voce tera de alterar o javascript tambem.

o html\css ja acabou.

JAVASCRIPT:

Explicação:

function clock() // define uma nova função com o nome de clock( relogio em ingles ).

 

var digital = new Date(); // define que a variavel digital, vai ser igual a uma nova data.

 

var hours = digital.getHours();

var minutes = digital.getMinutes();

var seconds = digital.getSeconds();

 // Isso ira pegar a Hora, o minuto e o segundo, da variavel digital.

 

if (minutes <= 9) minutes = "0" + minutes;

if (seconds <= 9) seconds = "0" + seconds;

 

//Essa parte não e obrigatoria, Por que?, simples, sem ela o relogio nao ficara assim olha, 8 : 05 : 06, mais sim 8 : 5: 6, entenderam? se nao ignora e deixa o codigo kkk

 

dispTime = hours + ":" + minutes + ":" + seconds; // define que a variavel dispTime, vai ser a hora + : + minutos + : + segundos.

 

var basicclock = document.getElementById('basicclock'); // vai pegar os elementos com a id basicclock, se voce alterou na parte do HTML\CSS, altere aqui tambem!

basicclock.innerHTML = dispTime; // define que o HTML interno, da id basicclock, sera igual a dispTime.

setTimeout("clock()", 1000); // reinicia o timer a 1000 milesegundos, ou seja 1 segundo.

 

clock(); // Isso nao fara nada alem de chamar a função pela primeira vez, e entao a função ira se reiniciar apos 1 segundo, sei la como explicar. ok.

Bem, foi isso, Funcionando: