Pagina aggiornata... Mercoledì, 20 settembre 2023 *
Tempo di caricamento
0.73
secondi
Link navigazione :
Home telaio ೡ Home ~ Tutorial ~ Script_gadget » *Data* |
..:: Data ::..
Vediamo come realizzare un accessorio/gadget per avere un datario in una pagina web
Possiamo visualizzare la data in quattro differenti formati, l'ultimo in ordine
di apparizione è la versione originale dello script che trovate nel sito dell'autore,
io mi sono solo divertita a "settarlo" per averlo con le varie opzioni ^_^
Lo script che useremo è molto semplice, si divide in due parti, la prima parte la posteremo
tra i tag <head> e </head> della pagina e sarà quella che conterrà i parametri con i quali sceglieremo
il formato della data che vogliamo visualizzare, la seconda parte di script, un piccolo richiamo del primo,
lo posteremo nel punto in cui vogliamo visualizzare la data e comunque sotto il tag <body>
Data semplice tipo datario:
<script type="text/javascript" language="JavaScript">
<!-- Original: Andrea Bianchi
// Web Site: https://www.web-link.it
function WebDate() {
var now = new Date();
var year= now.getYear();if (year < 1000) year += 1900;
nameMth = new Array('01','02','03','04','05', '06', '07', '08', '09', '10', '11','12');
document.write('' + now.getDate() + " / " + nameMth[now.getMonth()] + " / " + year+'');
}
// end -->
</script> |
# Prelevate qui lo script
Data in stile classico
<script type="text/javascript" language="JavaScript">
<!-- Original: Andrea Bianchi
// Web Site: https://www.web-link.it
function WebDate() {
var now = new Date();
var year= now.getYear();if (year < 1000) year += 1900;
nameMth = new Array('Gennaio','Febbraio','Marzo','Aprile','Maggio', 'Giugno', 'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre','Dicembre');
document.write('' + now.getDate() + " " + nameMth[now.getMonth()] + " " + year+ '');
}
// end -->
</script> |
# Prelevate qui lo script
Data con giorno della settimana e datario semplice
<script type="text/javascript" language="JavaScript">
<!-- Original: Andrea Bianchi
// Web Site: https://www.web-link.it
function WebDate() {
var now = new Date();
var year= now.getYear();if (year < 1000) year += 1900;
nameDay = new Array('Domenica','Lunedi','Martedi','Mercoledi','Giovedi','Venerdi','Sabato');
nameMth = new Array('01','02','03','04','05', '06', '07', '08', '09', '10', '11','12');
document.write('' +nameDay[now.getDay()]+ ' ' + now.getDate() + " / " + nameMth[now.getMonth()] + " / " + year+ '');
}
// end -->
</script> |
# Prelevate qui lo script
Data con giorno della settimana e datario classico
<script type="text/javascript" language="JavaScript">
<!-- Original: Andrea Bianchi
// Web Site: https://www.web-link.it
function WebDate() {
var now = new Date();
var year= now.getYear();if (year < 1000) year += 1900;
nameDay = new Array('Domenica','Lunedi','Martedi','Mercoledi','Giovedi','Venerdi','Sabato');
nameMth = new Array('Gennaio','Febbraio','Marzo','Aprile','Maggio', 'Giugno', 'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre','Dicembre');
document.write('' +nameDay[now.getDay()]+ ' ' + now.getDate() + " " + nameMth[now.getMonth()] + " " + year+ '');
}
// end -->
</script> |
# Prelevate qui lo script
Quindi postate tra i tag <head> e </head> della pagina lo script
nella versione che preferite e sotto il tag <body> nel punto in cui volete visualizzare la data nella pagina
scrivete il piccolo tag di richiamo che è lo stesso per tutte le versioni dello script
<script type="text/javascript">WebDate(); </script> |
# Prelevate qui lo script
La data si visualizzerà con il tipo, colore e misura di font stabilito per la pagina,
se si vuole diverso basterà scrivere una classe o uno style in linea, nella versione originale era
presente il parametro per inserire appunto la personalizzazione dello style ma siccome andava
a capo per i fatti propri io l'ho eliminato >_< se preferite lo potete ripristinare
- Nella parte di script che permette la visualizzazione della data trovate delle virgolette vuote:
document.write('' + now.getDate() + " / " + nameMth[now.getMonth()] + " / " + year+ ''); |
- Inserite i parametri che vi occorrono così:
* Qui il tag si spezza ma mi raccomando nello script lasciate tutto su una linea
document.write('p style="parametri font"' + now.getDate() + " / " + nameMth[now.getMonth()] + " / " + year+ '/p'); |
Smanettando sempre con la riga di codice che vi ho mostrato sopra è possibile fare
delle altre piccole personalizzazioni, ad esempio se al posto delle barre volete dei trattini
facendo sempre attenzione a non cancellare nulla sostitute così:
document.write('' + now.getDate() + " - " + nameMth[now.getMonth()] + " - " + year+ ''); |
- Se volete meno spazio tra un campo e l'altro della data, togliete lo spazio
tra i separatori e le virgolette che li contengono
document.write('' + now.getDate() + "-" + nameMth[now.getMonth()] + "-" + year+ ''); |
Ecco un esempio pratico
Se invece vogliamo visualizzare la data su più righe, tipo il giorno della settimana e poi a capo
il datario semplice o classico che sia, basterà inserire un <br> accanto al tag di richiamo
* Qui il tag si spezza ma mi raccomando nello script lasciate tutto su una linea
document.write('' +nameDay[now.getDay()]+ ' <br> ' + now.getDate() + " " + nameMth[now.getMonth()] + " " + year+ ''); |
Possiamo scrivere del testo o mettere altri script che si visualizzino prima e/o dopo la data,
un esempio pratico lo vedete all'inizio di ogni pagina di questa sezione
•°o. Buona notte O_o Benvenuti in html & script Tutorial Oggi è Giorno Settimana 0 Mese 0000 H: 00:00:00 Buona navigazione...
In questo caso io ho postato lo script per il saluto ad orario, un messaggino di benvenuto,
lo script per la data, uno script per l'ora e un'altro piccolo testo per augurare buona navigazione,
motivo per cui avevo tolto il parametro per la personalizzazione diretta nello script ^_^
Con un po' di pazienza e fantasia potete fare tutti gli esperimenti che vi vengono
in mente, nel menu trovate vari script da poter utilizzare 
Se volete realizzare dei gadget/accessori da far prelevare vi serviranno anche:
-> Iframe
-> Textarea
-> Pagina anteprima gadget
Spero di essere stata chiara in tutti i passaggi ^_^
Vi auguro buon lavoro ma sopratutto buon divertimento!
Ciao alla prossima^^ Penelope ♥
ೡ Dai un giudizio a questa guida... Grazie ^_^
|
Voti totali: |
1 |
Rating... |
5 |
|
Commentario...
Scrivi qui per lasciare un saluto, una richiesta di aiuto, un suggerimento o una critica ^_^
|
- Pagina visitata da 1178 utenti
|
H:
Buon Autunno
!
* Info sezione...
Mi farebbe molto piacere la condivisione
dei miei tutorial ma vi sarei anche molto grata
se evitaste di fare copia e incolla su altri spazi
del mio lavoro, linkate le pagine, avvisatemi
ricambierò senza problemi. Grazie ♥
..:: Basi ::..
..:: html ::..
..:: Script page ::..
..:: Script gadget ::..
Accessori e gadget del telaio...
..: Spazio web...
Realizzare e gestire un sito web
con l'hosting free più famoso...


Pagina Facebook del telaio... |
 |
|
|