orologio

**blogseui** · 31-05-2024, 12.11.35

ho provato a creare un orologio in javascript; ... ma si blocca!
stavo scrivendo il codice ma ho poi ho inserito una cosa che non va bene.
non scorrono i secondi!

scritto con notepad++, ma notato che salvando il file e pubblicando inseguito (copia e incolla), notepad modifca qualche cosa.
es: <font font="arial"> diventa <font font"arial">

potete aiutarmi?

il codice è un pò lungo quindi scrivo solo la parte dei secondi.

var data = new Date() document.write(data.getSeconds()) setTimeout("mytime()",1000);

trovate orologio su BLOG SEUI

ho provato anche con un datario (doppio); non è centrato nel riquadro widget.
come posso restringerlo?

grazie

**dreadnaut** · 31-05-2024, 12.24.53

Si, il codice è un po' lungo, ma è difficile discuterne senza averlo davanti. Altrimenti ogni persona che ti vuole aiutare deve andare a scavare nella tua pagina, trovare il punto giusto, e decifrarne il contenuto. Lo faccio una volta per tutte e lo copio qua:

Codice HTML:

<div id="block-6" class="widget widget_block">
  <! orologio creato da RE di SEUI (2010) !>
  <html>
    <TABLE BORDER=3 CELLPADDING=3 CELLSPACING=3 bgcolor="#ccccff" bordercolor="indigo">
      <tr>
        <TD COLSPAN=4>
          <center>
            <font font"arial" color="blue">
              <b> ORARIO  : </b>
            </font>
          </center>
        </TD COLSPAN=4>
      </tr>
      <tr>
        <TD COLSPAN=1>
          <center>
            <font font"arial">
              <b> ORE </b>
            </font>
          </center>
        </TD COLSPAN=2>
        <td>
          <center>
            <font font"arial">
              <b> MINUTI </b>
            </font>
          </center>
        </td>
        <td>
          <center>
            <font font"arial">
              <b> SECONDI </b>
            </font>
          </center>
        </td>
      </tr>
      <tr>
        <td>
          <center>
            <font font"arial" color="red">
              <b>
                <script type="text/javascript">
                  var data = new Date()
                  document.write(data.getHours())
                </script>
              </b>
            </font>
          </center>
        </td>
        <td>
          <center>
            <font font"arial" color="red">
              <b>
                <script type="text/javascript">
                  var data = new Date()
                  var m=new Date();
                  m=data.getMinutes();
                  if (m<10) m="0"+m;
                  document.write(data.getMinutes())
                </script>
              </b>
            </font>
          </center>
        </td>

      </center>
    </td>
    <td>
      <center>
        <font font"arial" color="red">
          <b>
            <script language="JavaScript">
              var data = new Date()				
              document.write(data.getSeconds())
              setTimeout("mytime()",1000);
            </script>
          </b>
        </font>
      </center>
    </td>

            </center>
          </td>
        </tr>
      </table>
    </html>
  <! orologio creato da RE di SEUI (2010) !>
</div>

**blogseui** · 31-05-2024, 12.51.52

Grazie, ... ma stavo per aggiungere una cosa; quindi poi lo avrei fatto.
Se possibile vorrei far comparire le doppie cifre:
no 8:5:3 ma 08:05:03

grazie in anticipo a tutti.

**alemoppo** · 31-05-2024, 20.15.38

Già per i minuti lo stai facendo:

Codice:

var m=new Date();
                  m=data.getMinutes();
                  if (m<10) m="0"+m;

Per i minuti funziona?

Per il discorso che si blocca, manca la funzione "mytime()" non definita... Sei sicuro di aver preso tutto il codice?

Ciao!

**blogseui** · 01-06-2024, 10.26.49

per minuti funziona.

no, non ho preso tutto il codice; ho perso una parte di codice.

non so quale funzione inserire!
suggerimenti?

**blogseui** · 01-06-2024, 10.57.40

stavo ricontrollando quello che mi avete fatto notare.

html+js funzionano lato client:
il datario (doppio) è in js; ... quindi devo fare una modifica per impostare data corretta.
non lo sapevo; adesso bisogna tener conto del fuso orario.
lo stesso per l'orologio se integro un orologio nel datario.
un altro con l'orario di Seui.

**blogseui** · 01-06-2024, 18.15.20

oggi ho scoperto che non funziona più questo:

var m=new Date();
m=data.getMinutes();
if (m<10) m="0"+m;

visualizzato 18:9:3

cosa non và oltre il blocco? e in m<10 (da fare anche s<10)?
devo ricontrollare formato ore (12 o 24)

**GraphOGLRisorse** · 01-06-2024, 18.59.13

Salve,
non può mai aver funzioanto in questo modo.

Codice:

m=data.getMinutes();
if(m<10) m="0"+m;
document.write(data.getMinutes())

Qui si memorizza il valore minuti nella variabile m (m=data.getMinutes()) però non viene usata poi la variabile m in document.write() ma nuovamente data.getMinutes(). La viariabile m e relativo controllo, se non viene usata così (document.write(m)) non hanno senso di esistere.

Così funziona:

Codice:

m=data.getMinutes();
if(m<10) m="0"+m;
document.write(m);

Iniltre, la funzione usare setTimeout() con mytime() se la funzione mytime() non esiste è inutile che ci sia.

Codice:

setTimeout("mytime()",1000);

L'uso di setTimeout() ha senso solo se si vuole impostare un aggiornamento automatico.

Cordiali saluti.

**blogseui** · 02-06-2024, 12.24.45

l'idea era quella; si deve aggiornare ogni secondo e così scorrono i secondi.
non ho capito come fanno molti ad usare 1000 'millisecondi'. Trovato in giro tante funzioni; ma gli altri usano 3 codici. ( funzione orologio, codice orologio, aggiornamento funzione ogni secondo) mentre io solo 1.

il codice lo sto semplificando e rendendolo più leggibile.

L'originale è su rediseui.altervista.org è dal 2010 che ci lavoravo prima di pubblicarlo su sito.

**blogseui** · 02-06-2024, 12.26.32

mi riferivo a setTimeout(), setinterval(), ecc

**alemoppo** · 02-06-2024, 14.05.07

Credo tu abbia bisogno di una cosa di questo tipo (eh sì, sono passati 14 anni

).

Ti consiglio quindi di partire dal codice che trovi lì, magari senza utilizzare l'orario del server ma sfruttando quello del PC dell'utente.
Potresti quindi partire da un codice un tantino fatto meglio, così:

Codice HTML:

<span id='orologio'></span>
<script>
function orologio()
{
    var data = new Date();
    var ora = data.getHours().toString().padStart(2, '0');
    var min = data.getMinutes().toString().padStart(2, '0');
    var sec = data.getSeconds().toString().padStart(2, '0');

    var giorno = data.getDate().toString().padStart(2, '0');
    var mese = (data.getMonth() + 1).toString().padStart(2, '0');
    var anno = data.getFullYear();

    document.getElementById('orologio').innerHTML = `${giorno}/${mese}/${anno} - ${ora}:${min}:${sec}`;
}

document.addEventListener('DOMContentLoaded', function()
{
    orologio();
    setInterval(orologio, 1000);
});

</script>

Ciao!

**blogseui** · 04-06-2024, 17.54.37

Grazie.

Sono riuscito a 'smontarlo' ma non so come ricostruire tutto in una tabella.

ho provato a creare un datario con tabella (partendo da 'orario' e 'calendario') ... ma se inserisco array il codice diventa enorme.
es.:
giorno, g=data.getDay(), 1=lunedì ... 0=domenica
mese, m=data.getMonth(); 1= febbraio ... 0=gennaio

ecc ...

cercavo i numeri romani per non far confusione

da 04/06/2024 a 04/VI/2024; alcuni si possono confondere (americani)

**blogseui** · 04-06-2024, 18.15.34

stavo lavorando anche su questo:

<div align="center">
<form name="formOrologio">
<input type="text" name="textOrologio" class="stileOrologio" onFocus="this.blur()" onSelectStart="return false;">
</form>
</div>

<script type="text/javascript">

</script>

<style type="text/css">
input.stileOrologio {
text-align: Center;
width: 100px;
border: Solid 3px indigo;
color: red;
font: Bold 12px colonna;
}
</style>

<body onLoad="Clock()">

volevo fare una piccola tabella da una cella o casella di testo tipo world.
ma non riesco a scomporre e ricomporre.
ore minuti secondi dì giorno mese anno

se il codice diventa troppo lungo lascio stare.

**alemoppo** · 04-06-2024, 19.33.37

Scusami ma non riesco a capire. In che senso utilizzi i numeri romani perché gli americani non capiscono i numeri?

Cosa intendi per "scomporre in una tabella"?

Invece di body onLoad utilizza addEventListener come nel codice che ti ho scritto.

Ciao!

**GraphOGLRisorse** · 04-06-2024, 20.01.32

Originalmente inviato da blogseui

volevo fare una piccola tabella da una cella o casella di testo tipo world.
ma non riesco a scomporre e ricomporre.
ore minuti secondi dì giorno mese anno

Ecco il codice con tabella aggiornato:

Codice HTML:

<style>table{display:table; width:300px;font-family:verdana,arial,sans-serif; font-size:13px;}.tr{display:table-row;}.td{display:table-cell;border:1px solid #ccc;}</style>

<div class="table" style="margin:0 auto;">
  <div class="tr">
    <div class="td" style="background:#e4e9ed;text-align:center;vertical-align:middle;width:277px;height:30px;color:blue;;">
      <b> ORARIO </b>
    </div>
  </div>
  <div class="tr" style="width:100%;">
    <div class="table" style="width:100%;">
      <div class="tr">
        <div class="td" style="text-align:center;vertical-align:middle;width:30%;height:30px;">
          <b> ORE </b>
        </div>
        <div class="td" style="text-align:center;vertical-align:middle;width:30%;height:30px;">
          <b> MINUTI </b>
        </div>
        <div class="td" style="text-align:center;vertical-align:middle;width:30%;height:30px;">
          <b> SECONDI </b>
        </div>
      </div>
      <div class="tr">
        <div class="td" style="text-align:center;vertical-align:middle;color:red;height:30px;">
          <b><span id="ore"></span></b>
        </div>
        <div class="td" style="text-align:center;vertical-align:middle;color:red;height:30px;">
          <b><span id="minuti"></span></b>
        </div>
        <div class="td" style="text-align:center;vertical-align:middle;color:red;height:30px;">
          <b><span id="secondi"></span></b>
        </div>
      </div>
    </div>
  </div> 
</div> 

<script>
function mytime(){
  var data = new Date();
  var h=data.getHours().toString().padStart(2, '0');
  var m=data.getMinutes().toString().padStart(2, '0');
  var s=data.getSeconds().toString().padStart(2, '0');
  
  document.getElementById("ore").innerHTML = h;
  document.getElementById("minuti").innerHTML = m;
  document.getElementById("secondi").innerHTML = s;
  
  setTimeout("mytime()",1000);
}

document.addEventListener('DOMContentLoaded', function(){
  mytime();
});
</script>

Così occupa anche meno righe.

Cordiali saluti.

**blogseui** · 05-06-2024, 12.17.59

GraphOGLRisorse;

grazie per aiuto; sto provando a giocare con il codice per capire come funziona è fare una piccola modifica. Ma va bene questo.
è solo per 'fare conoscenza' aa. con html, so fare qualche cosa in più.

**blogseui** · 05-06-2024, 12.24.24

per alemoppo;

per americani 04/06/2024 è 6 aprile, no 4 giugno! scrivendo 04/VI/2024 anche loro capiscono 4 giugno.

tabella:
smontare il codice ed inserirlo in una tabella.
sotto ore, solo il codice var HH = orologio.getHours()
sotto minuti, solo il codice var MM = orologio.getMinuts()
sotto secondi, solo il codice var SS = orologio.getSeconds()

ho imparato a costruire tabelle html e così scrivo meglio.

**seui** · 07-06-2024, 10.10.41

grazie: ho risolto un problema. ... ... ma ...
dopo che scrivo il codice con natepad++ e poi 'esegui con firefox', vedo una cosa.
dopo che scrivo codice in widget 'html personalizzato', vedo un'altra cosa.

o meglio la tabella risulta diversa.
nel primo caso si vede come una bella tabella html.
nel secondo una brutta tabella css.

**seui** · 07-06-2024, 10.11.21

dimenticavo; ho incrocciato i codici:

Codice HTML:

<script>
function mytime(){
  var data = new Date();
  var h=data.getHours().toString().padStart(2, '0');
  var m=data.getMinutes().toString().padStart(2, '0');
  var s=data.getSeconds().toString().padStart(2, '0');
  
  document.getElementById("ore").innerHTML = h;
  document.getElementById("minuti").innerHTML = m;
  document.getElementById("secondi").innerHTML = s;
  
  setTimeout("mytime()",1000);}

document.addEventListener('DOMContentLoaded', function(){mytime();});
</script>

<br></br>

<html>
<! orologio creato da RE di SEUI (2010) !>
<TABLE BORDER=3 CELLPADDING=3 CELLSPACING=3 bgcolor="#ccccff" bordercolor="indigo">
<tr> <TD COLSPAN=3> <center> <font font"arial" color="blue"> <b> ORARIO  : </b> </font> </center> </TD COLSPAN=3> </tr>
<tr> <td> <center> <font font"arial"> <b> ORE </b> </font> </center> </td>  
     <td> <center> <font font"arial"> <b> MINUTI </b> </font> </center> </td>
     <td> <center> <font font"arial"> <b> SECONDI </b> </font> </center> </td> </tr>
 <tr>
    <td> <center> <font font"arial" color="red"> <b> <css> <span id="ore"> </span> </css> </b> </font> </center> </td> 
	<td> <center> <font font"arial" color="red"> <b> <css> <span id="minuti"> </span> </css> </b< </font> </center> </td> 
    <td> <center> <font font"arial" color="red"> <b> <css> <span id="secondi"> </span> </css> </b> </font> </center> </td> 
 </tr> </table> 
<! orologio creato da RE di SEUI (2010) !>
</html>

**seui** · 07-06-2024, 10.17.05

devo elimare <br></br>

stavo usando due tabelle.
una da modificare e l'altra per confronto.

ma ho notato che è ininfluente, eliminare br /br.

**blogseui** · 07-06-2024, 11.15.37

ho provato a sostiture <css> </css> con <script="javascript"> </script="javascript"> ... stessa cosa! non cambia nulla.
prima l'orlogio rimaneva fermo, però la tabebella er più bella da vedere. aa

**GraphOGLRisorse** · 07-06-2024, 13.50.21

Originalmente inviato da blogseui

ho provato a sostiture <css> </css> con <script="javascript"> </script="javascript"> ... stessa cosa! non cambia nulla.

Che senso ha eseguire del codice CSS con i tag js?

Originalmente inviato da seui

dopo che scrivo il codice con natepad++ e poi 'esegui con firefox', vedo una cosa.
dopo che scrivo codice in widget 'html personalizzato', vedo un'altra cosa.

o meglio la tabella risulta diversa.
nel primo caso si vede come una bella tabella html.
nel secondo una brutta tabella css.

Originalmente inviato da blogseui

prima l'orlogio rimaneva fermo, però la tabebella er più bella da vedere. aa

Non ho capito il cosa cambia nella visualizzazione.

Può mettere un link ad una pagina in cui si vede il problema?

Cordiali saluti.

**blogseui** · 07-06-2024, 17.52.34

Che senso ha eseguire del codice CSS con i tag js?

: stavo provando a smontare e ricostruire il codice.
volevo capire meglio come funzionava. è anche così che si impara a programmare e capire qual'è il codice più adatto.

tabella: quando scrivo codice in html-personalizzato vedo una cosa; quando pubblico il codice vedo un'altra cosa. o meglio è diverso.
ho provato a fare tabelle in html,js e css. per vedere differenze.

troppo tardi, ormai si vedono tutte allo stesso modo, anche quelle che non ho ancora modificato.
provato ad incollare vecchio codice, ma non funziona ne anche così.

però posso mostrarlo in un articolo che poi eliminerò dopo Vostra visione.
schermata
ho scritto qualche riga sopra le schermate.

**GraphOGLRisorse** · 07-06-2024, 19.03.35

Originalmente inviato da blogseui

: stavo provando a smontare e ricostruire il codice.
volevo capire meglio come funzionava. è anche così che si impara a programmare e capire qual'è il codice più adatto.

Certamente, ma provare ad eseguire codice CSS con i tag <script></script> non ha senso. Non si otterra nulla.

Credo comunque che ci sia del codice CSS che va in conflitto.

Ha per caso usato questo codice pur avenndo ripristinato la tabella fatta solo con HTML?

Codice:

<style>table{display:table; width:300px;font-family:verdana,arial,sans-serif; font-size:13px;}.tr{display:table-row;}.td{display:table-cell;border:1px solid #ccc;}</style>

Comunque vedo che nella tabella per ore, minuti e secindi ci sta del codic di questo tipo.
[mtml]<script="javascript"> <span id="ore"> </span> </script="javascript">[/html]
Quei tag script che racciudono il tag span non servono, poichè non c'è codice js da eseguire.

notare anche che il datario è fuori dal blocco. come posso farlo stare all’interno del blocco?

La tabella andrebbe reso responsive tramite CSS.

Cordiali saluti.

**blogseui** · 07-06-2024, 19.16.10

grazie.

credo solo width:300px in table.

come risolvo 'non c'è codice js'? elimino?
però così ha funzionato.
codice originale ancora presente su rediseui.altervista.org

**blogseui** · 07-06-2024, 19.19.05

no, il codice è pubblicato qui; nella discussione #19.

Discussione: orologio

LinkBack

Strumenti discussione

Display

orologio

Tags for this Thread

Regole di scrittura