Addì 17 giugno 2010
Overlayer con jQuery per le campagne pubblicitarie
Link utili:
- Footerbanner con jQuery per le campagne pubblicitarie
- Headerbanner con jQuery per le campagne pubblicitarie
link interno
link esterno
Supponiamo, invece, di voler utilizzare overlayer diversi nello stesso sito. Possiamo sovrascrivere le variabili di default, impostate precedentemente, in questa maniera:
1 2 3 4 5 6 7 8 9 10 11 12
<script type="text/javascript"> $(document).ready(function() { $().overlayer({ ol_timetoclose: '20 sec', ol_cookielife: '15 sec', ol_advpage: 'pagina2.htm', ol_margintop: '50', ol_opacity:'n', ol_id:'camp2' }); }); </script>
In questa maniera otteniamo l’importante risultato di poter attivare overlayer diversi e indipendenti (nel cookie, nella pagina da richiamare, nelle opzioni, etc) richiamando sempre e solo gli stessi file javascript. Possiamo inserire e sovrascrivere tutte le variabili viste in precedenza.
Per essere ancora più chiari facciamo un esempio. Nella index del sito potremmo avere questo codice:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script> <script type="text/javascript" src="jquery.overlayer.js"></script> <script type="text/javascript"> $(document).ready(function() { $().overlayer({ ol_timetoclose: '20 sec', ol_cookielife: '15 sec', ol_advpage: 'pagina1.htm', ol_margintop: '50', ol_opacity:'n', ol_id:'ol1' }); }); </script>
Mentre in una pagina interna potrebbe essere necessario richiamare un file html diverso o impostare parametri di durata differenti dal primo caso. Avremo quindi un codice simile a questo:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script> <script type="text/javascript" src="jquery.overlayer.js"></script> <script type="text/javascript"> $(document).ready(function() { $().overlayer({ ol_timetoclose: '50 sec', ol_cookielife: '30 min', ol_advpage: 'pagina2.htm', ol_margintop: '150', ol_opacity:'y', ol_id:'ol2' }); }); </script>
Oltre alla personalizzazione dei parametri basilari, prestate attenzione alla variabile “ol_id“: sono differenti nei due casi. In questa maniera avremo cookie diversi per overlayer diversi. Se invece avessimo voluto utilizzare lo stesso cookie per le due campagne sarebbe bastato assegnare lo stesso nome o, meglio ancora, omettere direttamente la variabile.
Il codice è stato testato sui più diffusi browser in circolazione e non dovrebbero esserci problemi di compatibilità.
Download
Il pacchetto .zip contiene tutti i file necessari (compresi jQuery ed il plugin jquery.cookie). Per scaricare lo script cliccate sul link: Saibal jQuery Overlayer
- 2.298 visite
Vota: 100%
Loading ...
Elucubrazioni
Trash e dintorni
Pere di fosforo
My Ubuntu
Guide e Articoli
Editoriali
Motociclettando
Php for Geek
Tesi di Laurea
Ciao Saibal!!! Sei troppo forte!!!
Su IE ho problemi di visualizzazione, confermate?
IE quale versione? Io l’ho provato su IE 6,7 e 8. Non vedo problemi.
Ciao Saibal, stò provando ad installare il tutto su wordpress, ma proprio non mi riesce… in particolare secondo te in quale cartella dovrei caricare i file? Nella cartella del tema, o in quella principale del sito? Grazie mille Antonio
antonio sostanzialmente non fa differenza… io di solito li metto nel tema:
http://www.lorenzone.it/wp-content/themes/l9e/js/file.js
Alla fine ce l’ho fatta… il problema era che andava in conflitto con la barra wibiya che ho sul sito, ho dovuto inserire lo script di questa barra prima dello script che carica l’overlayer, ora va… grazie mille