Lo script che presentiamo permette di impostare dei link testuali che cambiano colore ad intervalli predefiniti. La scelta potrà essere fatta tra l'intermittenza dello sfondo o del colore di testo.
Il codice è compatibile con Explorer 5.x e con Netscape 6.x mentre non avrà effetto con Navigator.
- esempio.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.
Inseriamo lo script tra i tag <head> della pagina:
<script language="JavaScript1.2" type="text/javascript">
var flashlinks=new Array()
function changelinkcolor(){
for (i=0; i< flashlinks.length; i++){
var flashtype=document.getElementById? flashlinks[i].getAttribute("flashtype")*1 : flashlinks[i].flashtype*1
var flashcolor=document.getElementById? flashlinks[i].getAttribute("flashcolor") : flashlinks[i].flashcolor
if (flashtype==0){
if (flashlinks[i].style.color!=flashcolor)
flashlinks[i].style.color=flashcolor
else
flashlinks[i].style.color=''
}
else if (flashtype==1){
if (flashlinks[i].style.backgroundColor!=flashcolor)
flashlinks[i].style.backgroundColor=flashcolor
else
flashlinks[i].style.backgroundColor=''
}
}
}
function init(){
var i=0
if (document.all){
while (eval("document.all.flashlink"+i)!=null){
flashlinks[i]= eval("document.all.flashlink"+i)
i++
}
}
else if (document.getElementById){
while (document.getElementById("flashlink"+i)!=null){
flashlinks[i]= document.getElementById("flashlink"+i)
i++
}
}
setInterval("changelinkcolor()", 500)
}
if (window.addEventListener)
window.addEventListener("load", init, false)
else if (window.attachEvent)
window.attachEvent("onload", init)
else if (document.all)
window.onload=init
</script>
Il codice non richiede particolari modifiche se non la scelta della durata dell'effetto intermittenza.
In questa riga:
setInterval("changelinkcolor()", 500)
modifichiamo il valore "500" in base alle nostre esigenze. Un valore più alto renderà più lento l'effetto, viceversa con un valore inferiore si otterrà una intermittenza più veloce.
A questo punto dobbiamo personalizzare i link testuali a cui vogliamo applicare l'effetto.
Basterà semplicemente aggiungere queste stringhe all'interno del tag href:
id="flashlinkNUMERO_PROGRESSIVO" flashtype="0 oppure 1" flashcolor="COLORE"
Un normale collegamento come questo
<a href="#">Prova</a>
dovrà essere modificato in questa maniera
<a href="#" id="flashlink0" flashtype="1" flashcolor="yellow">Prova</a>
- Nell'attributo "flashlink" dovremo aggiungere (senza spazi) un numero progressivo partendo da 0 (zero). Ciò significa che un eventuale secondo link avrà valore numerico 1 e così via. È possibile applicare l'effetto ad un numero praticamente infinito di collegamenti.
- L'attributo "flashtype" può assumere i valori 0 oppure 1. Con 0 cambierà il colore del testo mentre con 1 varierà il colore dello sfondo del link.
- L'attributo "flashcolor" indica il colore dell'intermittenza. Può essere inserito qualsiasi valore che indichi un colore.
Altre modifiche non sono necessarie.
