I frames
I riquadri consentono di dividere la finestra di navigazione in più parti
e di visualizzare quindi su ciascuna di esse un diverso documento html.
Questa funzionalità risulta molto utile quando, ad esempio, si desidera
realizzare delle pagine che si modifichino solo in parte.
Ad esempio questa guida è stata realizzata utilizzando due riquadri verticali
in modo che l'indice che compare sulla sinistra rimanga inalterato quando si sfogliano
i diversi paragrafi.
Occorre però tener presente che alcuni browser (versioni di Netscape precedenti alla 2.0
o browser non grafici) non consentono di visualizzare i frame. Per questo motivo
sarebbe sempre buona norma offrire una pagina alternativa per coloro che navigano
con tali strumenti.
Per realizzare una pagina divisa in riquadri occorre creare un file html che contenga
le istruzioni per la suddivisione della pagina.
In questo file al posto del tag <BODY> si devono inserire:
il tag <FRAMESET> che
fornisce le informazioni per la suddivisione della pagina;
il tag <NOFRAME> (opzionale)
che fornisce un testo alternativo ai browser che non sono in grado di visualizzare i
frame.
Ad esempio il codice usato per creare i riquadri della presente guida è:
<HTML>
<HEAD>
<TITLE>Guida
HTML</TITLE>
</HEAD>
<FRAMESET cols="160,*"
border="0">
<FRAME src="indice.html"
name="indice" noresize>
<FRAME src="introduzione.html"
name="principale">
</FRAMESET>
<NOFRAMES>Attenzione
state utilizzando un browser che non supporta i frames. Potete trovare l'indice di questa guida
al seguente indirizzo: http://riemann.unica.it/studenti/guida/indice.html.
</NOFRAMES>
</HTML>
|
Tutti gli altri comandi HTML, che normalmente sono compresi tra i tag
<BODY>
.
.
.
</BODY>,
non possono essere usati nel file per la definizione dei riquadri.
Il tag <FRAMESET> consente di impostare la suddivisione della finestra di navigazione.
L'attributo cols realizza una divisione per colonne, l'attributo rows
per righe.
La dimensione delle righe o delle colonne può essere specificata in pixel,
come percentuale della finestra di navigazione oppure
usando il simbolo " * ". In quest'ultimo caso quella riga o colonna occuperà
tutto lo spazio lasciato disponibile dagli altri riquadri.
Le larghezze devono essere separate con una virgola ed il numero di riquadri generato
è uguale al numero di dimensioni inserite.
Nell'esempio precedente si è usata una divisione per colonne, la prima con
larghezza pari a 160 pixel, la seconda pari allo spazio rimanente nella finestra.
L'attributo border specifica la dimensione in pixel del bordo di separazione tra
i riquadri.
Alcuni esempi serviranno a chiarire meglio:
<HTML>
<HEAD>
<TITLE>Guida
HTML</TITLE>
</HEAD>
<FRAMESET cols="50,*,100" border="5">
<FRAME src="1.html">
<FRAME src="2.html">
<FRAME src="3.html">
</FRAMESET>
</HTML>
|
|
| - |
Netscape: Guida HTML |
_ |
X |
|
<HTML>
<HEAD>
<TITLE>Guida
HTML</TITLE>
</HEAD>
<FRAMESET cols="50%,25%,*" border="5">
<FRAME src="1.html">
<FRAME src="2.html">
<FRAME src="3.html">
</FRAMESET>
</HTML>
|
|
| - |
Netscape: Guida HTML |
_ |
X |
|
<HTML>
<HEAD>
<TITLE>Guida
HTML</TITLE>
</HEAD>
<FRAMESET rows="50,*,*" border="10">
<FRAME src="1.html">
<FRAME src="2.html">
<FRAME src="3.html">
</FRAMESET>
</HTML>
|
|
| - |
Netscape: Guida HTML |
_ |
X |
|
Nei tag <FRAME> tramite l'attributo
src viene specificato il file che deve essere visualizzato in quel riquadro,
per questo motivo non può essere omesso.
Le regole da seguire per indicare un file che si trova in una directory differente
da quella corrente sono le stesse viste per i link.
Quando in un riquadro compare un link che punta ad una nuova pagina, se non si specifica
diversamente, cliccando sul link la pagina viene caricata sullo stesso riquadro.
Questa impostazione può essere modificata attraverso l'attributo name
che consente di assegnare un nome a ogni riquadro. In questo modo inserendo
l'attributo target nel tag del link che richiama la nuova pagina, questa
può essere visualizzata nel riquadro desiderato.
Ad esempio i due frames di questa guida sono stati creati in questo modo:
<FRAME src="indice.html"
name="indice" noresize>
<FRAME src="introduzione.html"
name="principale">
Per far in modo che, cliccando sull'indice, la pagina venga visualizzata sul riquadro
di destra, i link dell'indice hanno la seguente forma
<A href="riquadri.html" target="principale">
Specificando inoltre l'attributo noresize, nel tag
<FRAME>,
si può far in modo che la dimensione del
riquadro non possa essere modificata dall'utente.
N.B. i tag <FRAME> non hanno il
corrispondente tag di chiusura ma devono essere sempre compresi tra il tag
<FRAMESET> e il il tag
</FRAMESET>.
Gli attributi del tag FRAME.
Gli attributi specificabili nel tag <FRAME> sono:
- noresize
- scrolling
- marginheight
- marginwidth
Le dimensioni dei frames, impostate nel tag <FRAMESET>
tramite l'attributo cols o rows, possono essere modificate dall'utente
spostando i bordi dei riquadri con il mouse. Se si vogliono creare dei frames di
dimensioni non modificabili, si deve inserire l'attributo noresize nel tag
<FRAME>.
Normalmente quando il contenuto di un file HTML è più esteso della
dimensioni della finestra di navigazione, il browser automaticamente dispone la
barra di scorrimento (orizzontale e/o verticale) per consentire all'utente di
visualizzare tutto il contenuto del documento.
Anche con i frames i browser operano allo stesso modo, solo che tramite l'attributo
scrolling è possibile non far visualizzare mai le barre di scorrimento
o farle visualizzare sempre. Cioè:
<FRAME scrolling="auto">
impostazione di default, visualizza le barre se necessario;
<FRAME scrolling="yes">
visualizza le barre sempre anche quando non servono;
<FRAME scrolling="no">
le barre non vengono visualizzate.
N.B. Attenzione con quest'ultima opzione parte della pagina potrebbe risultare
non visibile.
Gli attributi marginwidth e marginheight consentono di impostare le
dimensioni in pixel dei margini laterali, superiore ed inferiore dei riquadri.
Esempio:
<FRAMEmarginwidth="10"
marginheight="20">
imposta un margine laterale pari a 10 pixel ed un margine superiore e inferiore pari
a 20 pixel.
