Benvenuto su Oceano Risorse per Webmasters
Modules
· Home
· Argomenti
· Backgrounds
· Banners
· Colorhex
· Downloads
· Fonts
· Gallery
· Gif Animate
· Javascripts
· Manuali
· Recommend Us
· Themes
· Wallpapers
· Web Links
Gallery



Partners
Hosting gratuito

Open Source software development website

HTML.it - il portale italiano sul web publishing

Gratis.it

Dynamic Drive - DHTML code library

BOORP - archivio di risorse gratuite
Shinystat
 
Javascript Banner o testo a scomparsa
Postato da webmaster il Wednesday, 16 November @ 14:05:44 CET
Contributo di webmaster

Lo script di questo articolo è particolarmente flessibile nel suo utilizzo. Il codice ci permette di mostrare un'immagine, un testo o del codice html, in base alle preferenze dell'utente. Il visitatore, cliccando sull'elemento scelto, potrà decidere se visualizzarlo o meno grazie ad un cookie che registrerà sul suo pc le scelte compiute.

Commercialmente parlando si può utilizzare lo script per mettere un banner in
bella mostra nella pagina ma dando la possibilità di nasconderlo una volta cliccatoci sopra.
Oppure si può mostrare un messaggio di benvenuto all'utente solamente la prima volta
che accede al sito; sarà lui a decidere quando non visualizzarlo più.

Lo script va inserito tra i tags <head> della pagina:

<!-- INIZIO CODICE -->

<script type="text/javascript" language="javascript">
var adlink="Cookie";
var timeout=15; //secondi di durata del cookie
var showads = 1;
function adMessage(adcode) {
if (document.cookie == "") {
document.write(adcode);
} else {
var the_cookie = document.cookie;
the_cookie = unescape(the_cookie);
the_cookie_split = the_cookie.split(";");
for (loop=0;loop<the_cookie_split.length;loop++) {
var part_of_split = the_cookie_split[loop];
var find_name = part_of_split.indexOf("ad");
if (find_name!=-1) {
break;
}
}
if (find_name==-1) {
document.write(adcode);
} else {
var ad_split = part_of_split.split("=");
var last = ad_split[1];
if (last!=0) {
document.write(adcode);
} else {
showads=0;
}
}
}
}
function writeCookie(show) {
var today = new Date();
var the_date = new Date();
the_date.setTime(today.getTime() + 1000 * timeout);
var the_cookie_date = the_date.toGMTString();
var the_cookie = "ad="+show;
var the_cookie = the_cookie + ";expires=" + the_cookie_date;
document.cookie = the_cookie;
location.reload(true);
}
function handleClick(evnt) {
var targetstring = new String(evnt.target);
if (targetstring.search(adlink) != -1) {
writeCookie(0);
}
routeEvent(evnt);
return true;
}
if (window.Event) {
window.captureEvents(Event.CLICK);
}
window.onClick = handleClick;
adMessage('');
// End -->
</script>

<!-- FINE CODICE -->

Lo script setta un cookie sul pc dell'utente nel momento in cui si clicca sul link indicato.
La personalizzazione del codice riguarda solamente una variabile e cioè quella che determina
la durata del cookie prima che questo si autodistrugga e venga visualizzato
nuovamente l'immagine o il testo.

var timeout=15;

in questo esempio abbiamo una durata di 15 secondi dopo i quali il banner tornerà
ad essere visibile. Se volessimo impostare la durata del cookie ad un giorno basterà inserire 60*60*24

var timeout=60*60*24;

cioè: 60 secondi * 60 minuti * 24 ore = 86400 secondi

Adesso, nel punto preciso in cui vogliamo far apparire il banner, inseriamo questo codice:

<span onClick="writeCookie(0)">
<div align="center"><script type="text/javascript"
language="javascript"> <!--
adMessage('<a href="http://www.google.it">Google</a><br /><div align="center">
<font face="verdana" size="2">Si può rimuovere il link cliccandoci
sopra</font></div>'); // -->
</script>
</div>
</span> 

La stringa appena analizzata può essere personalizzata a piacimento: possiamo
inserire codice html, una frase, un banner, un'immagine; dovremo rispettare solamente alcune piccole regole:

    se utilizziamo un link è importante usare il target _blank o _new
    se utilizziamo degli apostrofi nelle frasi all'interno della stringa dovremo farli precedere da un back slash ()

nel caso non volessimo utilizzare un link esterno, per nascondere il banner
basterà utilizzare un link strutturato in questa maniera:

<a href="#"><img src="freephp.gif" border="0"></a>

Teoricamente lo script è già completo ma volendo possiamo inserire un collegamento
per dare la possibilità di ricaricare immediatamente ciò che è stato nascosto senza
dover aspettare che il cookie si autodistrugga:

<script language="javascript" TYPE="text/javascript">
if (!showads) {
document.write('<div align="center"><a href="#"
onClick=writeCookie(1)><font face="verdana" size="2">Ricarica il banner</font></a></div>')
}
</script>

Questo semplice script, posizionato in un punto qualsiasi della pagina, verrà mostrato
solamente dopo che l'utente ha cliccato sul banner (quando, cioè, ha ricevuto il cookie sul suo pc).
È molto importante, soprattutto per Netscape 6, mettere il carattere "#" nel link in modo
da fare un refresh della pagina e ricaricare, così, il banner nascosto.


 
Links Correlati
· Indice Javascript
· Inoltre Javascript
· News by webmaster


Articolo più letto relativo a Javascript:
Reload automatico della pagina

Valutazione Articolo
Average Score: 5
Voti: 3


Please take a second and vote for this article:

Eccellente
Molto Buono
Buono
Regolare
Cattivo

Opzioni

 Pagina Stampabile Pagina Stampabile

Associated Topics

Javascript





Questo sito è ospitato gratuitamente da Altervista
Tutti i logos e i marchi presenti in questo sito sono dei loro proprietari.
I commenti sono proprietà  di chi li ha postati, tutto il resto © 2002 by Oceano Risorse per Webmasters
PHP-Nuke Copyright © 2005 by Francisco Burzi. This is free software, and you may redistribute it under the GPL. PHP-Nuke comes with absolutely no warranty, for details, see the license.
Generazione pagina: 0.05 Secondi

Theme by

© Oceanoweb