Pagina aggiornata... Venerdì, 06 Marzo 2026 * Tempo di caricamento 0.003 secondi
Link navigazione : Home telaio ೡ Home ~ Tutorial ~ Script_pagina » Testo evidenziato lettera per lettera

..:: Testo con effetto evidenziatore ::..

Questo script è stato scritto per rendere ben visibile un numero di telefono...
ma nulla ci impedisce di utilizzare questo simpatico effetto per titoli e/o scrittine



Il codice è molto semplice, i parametri che si possono personalizzare sono tre,
un eventuale colore di sfondo per il testo, il colore dell'evidenziatore e la velocità per l'effetto

N.B.: Lo script non funziona se nella pagina è presente il doctype

Ecco il codice dello script da inserire sopra il tag </head> della pagina

<script type="text/javascript">
var bgcolour="#f0e4ca"; // Colore sfondo base testo se non serve lascia bgcolour=" ";
var hlcolour="#f8f2e2"; // Colore evidenziatore
var speed=250; // Velocità cambio colore, 1 secondo = 1000
/****************************
* Phone-In Text Effect *
*(c) 2003-6 mf2fm web-design*
* http://www.mf2fm.com/rv *
* Non modificare questa parte di codice *
* Tradotto e spiegato da https://www.iltelaiodipenelope.it *
****************************/
var p_txt; window.onload=function() { if (document.getElementById) {
var phoni;
var phone=document.getElementById("phonein"); p_txt=phone.firstChild.nodeValue;
while (phone.childNodes.length) phone.removeChild(phone.childNodes[0]);
for (var i=0; i<p_txt.length; i++) {
phoni=document.createElement("div");
phoni.style.display="inline";
phoni.setAttribute("id", "phon"+i);
phoni.appendChild(document.createTextNode(p_txt.charAt(i)));
phone.appendChild(phoni);
}
phone_me((p_txt=p_txt.length)-1);
}
}

function phone_me(p_cnt) {
var p_tmp=document.getElementById("phon"+p_cnt); p_tmp.style.fontWeight="normal";
if (document.all) p_tmp.style.filter='';
p_tmp.style.backgroundColor=bgcolour;
p_cnt=++p_cnt%p_txt;
p_tmp=document.getElementById("phon"+p_cnt);
if (p_tmp.firstChild.nodeValue!=" ") {
p_tmp.style.fontWeight="bold";
if (document.all) p_tmp.style.filter="GLOW(strength=3, color=#"+bgcolour+")";
p_tmp.style.backgroundColor=hlcolour;
}
setTimeout("phone_me("+p_cnt+")", speed);
}
</script>

All'inizio del codice troviamo i tre campi che si possono personalizzare, il primo per
il colore dello sfondo nel testo, se non serve basta lasciare vuoto il parametro bgcolour="";
nel secondo impostiamo il colore per l'evidenziatore e nel terzo la velocità dell'effetto

Ed ecco il tag in cui scrivere il testo da postare dove si vuole visualizzare

<span id="phonein">Testo messaggio</span>

Il messaggio si visualizzerà con l'effetto arcobaleno e con il font impostato nella pagina
se si vuole differente si può scrivere una classe css o in linea nel tag

<span style="font-family:xxx; font-size: xxpx; color : #xxxxxx;" id="phonein">Testo</span>

Ecco un piccolo esempio in cui ho impostato anche il colore di sfondo per il testo



# Prelevate qui le parti di codici necessarie


- Codice dello script da inserire tra i tag <head> e </head>




- Tag in cui scrivere il testo




Spero di essere stata chiara in tutti i passaggi ^_^
Vi auguro buon lavoro ma sopratutto buon divertimento!
Ciao alla prossima^^ Penelope ♥


Dai un giudizio a questo tutorial... Grazie ^_^

📄 ✨ Apprezzato
60%
Voti totali: 1
Rating... 3




Commentario...

Scrivi qui per lasciare un saluto, una richiesta di aiuto,
un suggerimento o una critica ^_^









~ Pagina visitata da 1667 utenti





Segui il telaio su Facebook

* Info sezione...

Mi farebbe molto piacere la condivisione
dei miei tutorial ma vi sarei anche molto grata
se evitaste di fare copia e incolla su altri spazi
del mio lavoro, linkate le pagine, avvisatemi
ricambierò senza problemi. Grazie ♥


Basi e utilità pagine web



html tag scrittura pagine web





Script per pagina



Script per gadget




Preleva anche tu una tag Help donna

Aiutami a diffondere il più possibile informazioni
utili alle donne vittime di abusi... Grazie!



Link del telaio...

ೡ Il telaio di Penelope
☆ Template webset e blog
☆ Un sito su AlterVista
☆ Gif & co...





I vostri messaggi...

marina ~ 20/09/2026 20:04:19
Grazie infinite per il bellissimo calendario.
ૡScritto in Calendario magico box small
Jacques ~ 20/09/2026 17:12:13
Hey I know this is off topic but I was wondering if you knew of any widgets I could add to my blog that automatiy tweet my newest twitter updates.I've been looking for a plug-in like this for quite some time and was hoping maybe you would have some experience with something like this.Please let me know if you run into anything.I truly enjoy reading your blog and I look forward to your new updates.
ૡScritto in Home
ૡPenelope ♥ ~ 14/09/2026 22:32:30
Cara Filo d'arianna un po' di anni fa ho realizzato qualche grafica per ForumFree ed era un delirio non so se è ancora così ma la grafica si componeva con decine di piccole immagini, davvero tanto lavoro nemmeno gratificante purtroppo, per quanto riguarda i tutorial, sono una maniaca di html, php e js ma sulla gestione di un forum non saprei da dove partire Un abbraccio forte
ૡScritto in Blogger Kit Autunno
ૡPenelope ♥ ~ 14/09/2026 18:34:20
Carissima Filo d'arianna grazie alla tua segnalazione ho risolto un problema nel commentario purtroppo per evitare spam e messaggi sgradevoli avevo impostato un eccesso nei controlli, ripristinato, ora si può commentare e mettere url del proprio spazio senza problemi grazie infinite cara un abbraccio forte forte
ૡScritto in Home
filod'arianna ~ 14/09/2026 07:41:37
Ciao Penelope! Ho preso il Settimanello micioso:-DL'ho inserito all'interno della sezione "Appunti" sul mio forum, però ho visto che non si può più linkare qui nei messaggi, non riesco a farti vedere dove l'ho inserito. Ad ogni modo il forum è Librandosi tra le pagine, su forumfree. Un abbraccio a presto!
ૡScritto in Home
filod'arianna ~ 12/09/2026 06:52:57
Hai mai pensato di buttarti nel creare grafica e tutorial per ForumFree? 😂 Sto scherzando, ma solo a metà! Sarebbe fantastico. Ne approfitterei immediatamente
ૡScritto in Blogger Kit Autunno
ૡPenelope ♥ ~ 11/09/2026 16:56:26
Carissima Filod'arianna ti ringrazio tantissimo è il più bel complimento che si possa riceve! Un abbraccio forte e viva l'autunno!!!
ૡScritto in Blogger Kit Autunno
filod'arianna ~ 10/09/2026 07:03:48
Adoro il colore di Ortensie vorrei un blog su Blogger solo per i tuoi kit e i tuoi accessori:-D Grazie mille per tutto ciò che metti a disposizione carissima 😘N.B. Anch'io non vedevo l'ora che arrivasse un po' di fresco -.-'
ૡScritto in Blogger Kit Autunno
Cris ~ 02/07/2026 19:45:24
Ciao, sono passata per un salutino e per rivedere il tuo sito. Buona serata e buon fine settimana.
ૡScritto in *Amici del telaio...*
DanyGraphic ~ 30/05/2026 15:30:54
Ciao Penny , sempre belle e interessanti le tue pagine .Un abbraccio e buon fine settimana
ૡScritto in Home