Lo script che presentiamo ci permetterà di caricare, in modo casuale, dei documenti esterni all'interno di una pagina. Grazie ad una veloce distinzione del browser in uso sarà possibile utilizzare il codice anche con Netscape 4.x che, sappiamo, non riconosce il tag <iframe> bensì il tag <ilayer>.
Lo script può essere utile in quei casi in cui si vogliano mostrare a rotazione non solo semplici parti di testo ma veri e proprio documenti con immagini, tabelle ed altri elementi.
I file esterni potranno anche non contenere i tag <html>, <body> etc ma solo il codice necessario da includere.
L'esempio si compone di 4 file:
- esempio.htm
- random1.htm
- random2.htm
- random3.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.
Lo script va inserito nel <body> della pagina che includerà i file e va posizionato nel punto esatto in cui vogliamo che vengano mostrati gli iframe:
<script language="JavaScript1.2">
var ie=document.all&&navigator.userAgent.indexOf("Opera")==-1
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-
1
var iframeprops='width=400 height=100 marginwidth="0" marginheight="0"
hspace="0" vspace="0" frameborder="no" scrolling="no"'
var randomcontent=new Array()
randomcontent[0]="random1.htm"
randomcontent[1]="random2.htm"
randomcontent[2]="random3.htm"
//netscape
var arraynumb = randomcontent.length;
casual=Math.floor(Math.random()*arraynumb)
var ilayerand = randomcontent[casual];
if (ie||dom){
document.write('<iframe id="dynstuff" src=""
'+iframeprops+'></iframe>');
}
else{
document.write('<ilayer align="center" name="' + ilayerand + '" src="' +
ilayerand + '"></ilayer>');
}
function random_iframe(){
if (ie||dom){
var iframeobj=document.getElementById? document.getElementById("dynstuff") :
document.all.dynstuff
iframeobj.src=randomcontent[Math.floor(Math.random()*randomcontent.length)]
}
}
window.onload=random_iframe
</script>
Vediamo come personalizzare il codice:
var iframeprops='width=400 height=100 marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="no" scrolling="no"'
questa stringa contiene le caratteristiche dell' iframe (saranno valide quindi per Internet Explorer e Netscape 6.x).
Abbiamo nell'ordine:
- lunghezza
- altezza
- distanza del documento incluso dal lato sinistro dell'iframe
- distanza del documento incluso dal lato superiore dell'iframe
- distanza orizzontale dell'iframe dagli altri elementi della pagina (in pixel)
- distanza verticale dell'iframe dagli altri elementi della pagina (in pixel)
- bordi dell'iframe (yes o no)
- barre di scorrimento nell'iframe (yes o no)
var randomcontent=new Array()
randomcontent[0]="random1.htm"
randomcontent[1]="random2.htm"
randomcontent[2]="random3.htm"
è l'array che contiene i documenti da caricare in modalità random. basterà inserire il nome della pagina da includere con o senza percorso assoluto. possiamo aggiungere un numero a piacere di array seguendo la numerazione progressiva tra le parentesi quadrate.
per inserire un'eventuale nuova pagina, quindi, basterà aggiungere
randomcontent[3]="random4.htm"
Non è necessario che le pagine incluse abbiano i tag <html>, <head>, <body> etc. Possono anche contenere i tag strettamente necessari. Se invece includeremo dei documenti "completi" (con tutti i tag principali) non ci saranno problemi.
Altre personalizzazioni non sono necessarie.