Menu
1 user viewing this page!
Alcune configurazioni del Calender 2 con codice cut/paste
Esempio di calendario multi mese
Questo esempio è stato preso come ispirazione dal sito dynamicdrive.com che utilizza lo script basiccalendar.js ; esiste anche una versione distribuita da Brian Gosselin chiamata Simple Calendar Creator - V1.3 che utilizza lo script calender.js che differisce di poco da basiccalender.js
Nota: In tutti questi esempi si è utilizzato lo script basiccalendar.js
Per realizzare questo calendario è necessario inserire tra i tags <head> e </head> il seguente codice per utilizzare il calendario :
Codice CSS e script
In questo modo con i CSS è stato personalizzato il calendario, adesso inseriamo il codice per visualizzare i tre mesi del calendario
Ora qualche chiarimento sulla funzione buildCal() che permette la visualizzazione del calendario :
buildCal(4, 2006, "main", "month", "daysofweek", "days", 0)
| 4 | Corrisponde al mese che vuoi visualizzare, dove 1=Gennaio, e 12=Dicembre. |
| 2006 | L’anno che vuoi visualizzare. |
| main | Nome della classe CSS relativa alla tabella esterna del calendario. |
| month | Nome della classe CSS relativa al box mese/anno. |
| daysofweek | Nome della classe CSS relativa alla riga giorni settimana |
| days | Nome della classe CSS relativa alla cella individuale del giorno. |
| 0 | Lo spessore del bordo tra tutte le celle. 0=no bordo. |
La funzione buildCal() restituisce semplicemente l’intero calendario nella disposizione della stringa, per visualizzarla sullo schermo, dovrete invocare la document.write().
document.write(buildCal(4, 2006, "main", "month", "daysofweek", "days", 0))
A questo punto la configurazione è terminata , partendo da questa struttura e variando i CSS a vostro piacere potrete ottenere svariate combinazioni da utilizzare per i vostri calendari.
Calender pageDownload
Questo esempio completo lo trovate a questo link
Esempio di calendario dinamico con combo box menu
Questo esempio di calendario visualizza in modo dinamico il calendario utilizzando i combo box menu
Il codice da utilizzare è il seguente lasciando il CSS invariato come riportato nella textarea Codice CSS e script nel TAB del calendario Multimese. L'unico parametro da modificare è quello relativo alle dimensioni del calendario nel tag .main { width: 200px; ... }
Adesso richiamiamo lo script del calendario
Rispetto al codice originale il codice qui sopra riportato differisce nei seguenti punti
- Il calendario è in italiano
- Il CSS del calendario è differente
- Il primo giorno della settimana inizia da Lunedi
- Il codice rispetta le regole del consorzio W3C
Altre operazioni non sono necessarie.
Modificando ulteriormente i CSS originali si può ottenere qualcosa di simile
Download
Questo esempio completo lo trovate a questo link.
E adesso ecco il calendario annuale preso come ispirazione da scriptasylum.com sito distributore di questo script.
Questo calendario annuale rispetto al codice originale differisce nei seguenti punti :
- Il calendario è in italiano
- Il CSS del calendario è differente
- Il primo giorno della settimana inizia da Lunedi
- Il codice rispetta le regole del consorzio W3C
- Il giorno odierno è evidenziato
inserite tra i tags <head> e </head> il seguente codice per la personalizzazione del calendario come potete vedere di seguito:
A questo punto dovete utilizzare questo codice per creare il calendario annuale
Ecco il risultato finale
Download
Questo esempio completo lo trovate a questo link.
Ultima modifica :28/02/08 alle ore 11:48
Copyright©2003-2008 http://www.experimentweb.info E-mail