| ||||||||||||||||
 StaffScripts Elementi fissi nella pagina - Nuova versione | |||||||||||||||||||||||||
| Autore: Gianni | Data: 30/04/2003 | Downloads: 1436 | Voto: 4,9/5 | Download | P r o v a | ||||||||||||||||||||
|
Elementi fissi nella pagina - nuova versione
Avere un elemento html fisso (in verticale) nelle proprie pagine web è una richiesta molto frequente! A causa però di alcuni fattori tra cui l'incompatibilità tra i browser e gli effetti di vibrazione indesiderati e altro... spesso si abbandona il progetto, magari convincendosi che è stata anche la cosa migliore ;-)
Ora non c'è più nessun problema! Potete scaricarvi questo script facile da utilizzare e da personalizzare! Descrizione Questo script inserisce l'elemento che si vuol fissare (immagine, testo, tabella, iframe...) in un layer (di seguito i termini "elemento" e "layer" si utilizzeranno indifferentemente), e verrà posizionato dove si è impostato anche a fronte di uno scorrimento verticale della pagina. Compatibilmente al browser dell'utente, lo script si impegna ad utilizzare la soluzione migliore per "fissare" l'elemento; infatti, con IE (almeno fino a IE6) è inevitabile una lieve vibrazione che, invece, è completamente assente con OP, NN, MZ e tutti i browser che supportano correttamente l'attributo position:fixed. Anche per i browser più datati (ad es. NN4.x) è prevista una soluzione; cioè, si impiega una funzione chiamata ricorsivamente (ogni 25 ms) che riposiziona di continuo il layer (fino ad oggi, questa è ancora una delle soluzioni più usate). Implementazione Lo script si trova nel file fixed.js e va copiato integralmente nella vostra pagina HTML, oppure è possibile includerlo come file esterno (<script type="text/javascript" src="fixed.js"></script>). Dopodiché, dove si vuole all'interno di <body>, va chiamata la funzione putlayer() che genera il layer. Utilizzo e personalizzazioni principali Per il corretto funzionamento dello script, devono essere chiamate delle funzioni negli event-handler del <body>: <body onLoad="ini_fixed()" onScroll="noscroll()"> la prima serve ad inizializzare lo script (settando le variabili e facendo partire le funzioni), la seconda serve a sfruttare eventualmente l'evento di scrolling di pagina qualora il browser lo supportasse e lo richiedesse. Per generare il layer si utilizza la funzione putlayer(): <script type="text/javascript"> <!-- putlayer(); //--> </script>Il contenuto del layer, cioé l'oggetto da fissare, può essere qualsiasi cosa (immagine, testo, tabella, iframe...), basta che sia inserito in forma di stringa senza invii nella variabile globale contained che nell'esempio è settata in questo modo: contained='<p align="center"><a href="http://www.jsdir.com" target="_blank"><img border="0" src="nuovologo.gif" width="180" height="56" alt=""></a></p>' Infine è possibile far sparire l'elemento dopo che sia trascorso un determinato tempo, impostando opportunamente la variabile globale lifetime (invece per averlo sempre visibile bisogna porre lifetime=-1): lifetime=15000; //Tempo [ms] Avvertenze Come spesso accade con questi script, per facilitare la personalizzazione, si fa largo uso di variabili globali che non vanno ridichiarare come tali in altri script eventualmente presenti nella propria pagina; infatti, ciò causerebbe conflitti dannosi! Pertanto elenco di seguito dette variabili e già che ci sono anche i nomi delle funzioni, rimandando le spiegazioni (e i significati relativi) ai commenti presenti in fixed.js: top_start top_scroll lifetime divlayer_id div_prop layer_prop contained auto fixed timer instantop getRef(id) top() noscroll() autonoscroll() ini_fixed() putlayer()Per qualsiasi chiarimento sullo script scrivete a Gianni | |||||||||||||||||||||||||
| |||||||||||||||||||||||||
| Per navigare correttamente il sito è necessario abilitare i cookies. |
| Enjoy Open Source! |
Stampa
Segnala 
Preferiti 
