Lo script che presentiamo è utile per fare in modo che, il layout dei nostri siti, si adattino ad ogni tipo di risoluzione video.
Questo codice, infatti, rende omogenee le varie visualizzazioni di un sito riportando di fatto ogni risoluzione a quella più diffusa, ovvero 800x600 pixel. Il sistema usato è quello di ricreare automaticamente uno schema a frames che riproduce in centro pagina uno spazio da 420x750 pixel, ovvero con le dimensione canoniche con cui viene visualizzata una pagina su uno schermo 800x600.
Attorno alla finestra di lavoro viene visualizzata una cornice del colore che si vuole. Lo script è assolutamente automatico, va inserito necessariamente nella testa di ogni pagina del sito (ovvero tra i TAG <head> e </head> ) e non necessita di alcuna modifica, se non per quanto riguarda il colore di sfondo della cornice.
L'esempio si compone di 2 file:
- esempio.htm
- sfondo.htm
Per una più semplice comprensione del presente script fai continuamente riferimento ai file sopracitati, verificando le procedure e i dati espressi. Solo in questo modo, con un continuo confronto, comprenderai le peculiarità di questo Javascript.
Mettiamo il codice, in ogni pagina del nostro sito, tra i tag <head>:
<script type="text/javascript" language="javascript">
//CopyLeft by MarcoCavicchioli.it
if (self.name==top.name)
{
sfondo="#ff0000";
document.write('<frameset rows="*,420,*" border="0" framespacing="0"
frameborder="0" margin="0">')
document.write('<frame scrolling="no" noresize target="principale"
marginwidth="0" marginheight="0" src="sfondo.htm">')
document.write('<frameset cols="*,750,*">')
document.write('<frame src="sfondo.htm" marginwidth="0" marginheight="0"
scrolling="no" target="_self" noresize>')
document.write('<frame name="centrale" src='+document.location.href+'?a
marginwidth="0" marginheight="0" scrolling="auto" noresize>')
document.write('<frame marginwidth="0" marginheight="0" scrolling="no"
noresize src="sfondo.htm" target="principale">')
document.write('</frameset>')
document.write('<frame scrolling="no" noresize src="sfondo.htm"
target="principale" marginwidth="0" marginheight="0">')
document.write('</frameset>')
frames[0].document.bgColor=sfondo;
frames[1].document.bgColor=sfondo;
frames[3].document.bgColor=sfondo;
frames[4].document.bgColor=sfondo;
}
</script>
Le misure del frameset sono già impostare per una visione a 800x600 e teoricamente non andrebbero toccate; siete ovviamente liberi di personalizzare il frameset come volete.
Fatto questo dobbiamo creare un semplice documento html (potrà anche essere vuoto) e chiamarlo, in questo caso, "sfondo.htm".
L'unico parametro da modificare è
sfondo="#ff0000";
è la variabile che va personalizzata con la scelta di colore per la cornice.
ATTENZIONE: con NETSCAPE 6.0 potremmo avere qualche problema con la proprietà "document.bgColor". Per visualizzare lo sfondo anche con NN 6.0 basterà impostare il parametro "bgcolor" nel body di "sfondo.htm" (<body bgcolor="#c6c6c6">).
Come consiglio sempre quando si utilizzano codici uguali per tutte le pagine, è buona regola mettere lo script in un file esterno con estensione .js e senza i tag <script> e </script>.
In ogni pagina, poi, basterà inserire questa riga di richiamo tra i tag <head>:
<script language="javascript" src="nome_file.js"></script>
Così facendo, in caso di modifiche, ci basterà lavorare su un solo file (nome_file.js appunto).
Altre modifiche a questo semplice quanto utile script non sono necessarie.
