Appunti di Javascript

Redirect della pagina dopo n secondi

Molte volte abbiamo la necessità di fare una redirect ad un altra pagina dopo n secondi.
Non dobbiamo far altro che inserire il seguente codice nella sezione HEAD

	<META HTTP-EQUIV="Refresh" CONTENT="<num_secondi>"; URL="< new_url > ">

Per esempio:

	<META HTTP-EQUIV="Refresh" CONTENT="5"; URL="http://www.geocities.com/marcopipino">

redirige la pagina la mio sito dopo 5 secondi.

Gestione della query string lato client

Di solito la gestione della query string avviene lato server tramite asp o php.
Ho avuto la necessità di gestirla qui su Geocities (e questo mi ha creato qualche problemino) per la sezione dedicata agli scacchi dove non potevo fare centinaia di pagine per la visualizzazione migliaia di problemi.
Se date uno sguardo vedrete che alcune pagine (ecm.html) hanno una query string del tipo ?pagina=2. Il codice che potete scaricare da questo link è così riassunto:

	function QueryString(parametro){
		// prima divisione dovuta a geocities che mette ?0023832 dopo l' url
		var blocchi = self.location.href.split("?");
		// il blocco centrale (in geocities o finale per altri lo suddivido in base al carattere &
		var variabili=blocchi[1].split("&");
		var elementi=new Array();
		var temp_param, result;
		// creo l'array con tutti gli elementi
		for(i = 0; i < variabili.length; i++){
			// creo l'array temp_param 
			temp_param=variabili[i].split("=");
			//creo l'array bidimensionale con la coppia nome - valore
			elementi[i]=new Array();
			elementi[i][0]=temp_param[0];
			elementi[i][1]=temp_param[1];
		}
		// il ritorno di default è la stringa vuota
		result = "";
		for(j = 0; j < elementi.length; j++){
			// per ogni parametro se il nome è uguale a quello richiesto
			if(elementi[j][0]==parametro){
			//restituisco il valore
			result=elementi[j][1];
			// ed esco
			break;
			}
		}
		return result;
	}

All'interno della vostra pagina basta gestire con lo sctipt una semplice variabile

	<script language=javascript>
		var a = QueryString("miavariabile"
	</script>

Come creare un menu fluttuante (floating menu)

Nella home page c'è un esempio di come gestire un menu fluttuante.
Nulla di più semplice. Basta creare il proprio menu in una tabella (TABLE) o un oggetto DIV. A questo punto gestire nel corpo della pagina l'evento onscroll e onresize

	<body onscroll=>"javascript:mia_funzione()" onresize="javascript:mia_funzione()" >

Di fatto assegniamo un id al nostro oggetto nel quale c'è il menu e lo gestiamo tramite una funzione.

	<TABLE id=mio_oggetto>

E poi creiamo la funzione che ad ogni scroll della pagina e ad ogni ridimensionamento della finestra sposta il nostro menu.

	function mia_funzione(){
		mio_oggetto.style.position = 'absolute';
		mio_oggetto.style.left = '0px';
		mio_oggetto.style.top = document.body.scrollTop + 50;
		}
	mia_funzione();

In questo caso il menu viene visualizzato in alto a sinistra.