Pubblicato il 13/10/11e aggiornato il

Come inserire testo o immagini lampeggianti.

Esiste un tag specifico per rendere lampeggiante una porzione di testo. Si tratta di blink, ha però il grosso problema di non funzionare con Internet Explorer e con Chrome. Solo Opera e Firefox lo supportano. Vediamo come si possano creare oggetti lampeggianti con un semplice javascript. Passo a presentare due possibili opzioni tra cui si potrà scegliere quella più conveniente.
Prima soluzione per inserire oggetti lampeggianti
Basta incollare nel post in Modalità HTML un codice di questo tipo
<div id="blink" style="text-align: center;"> <a href="http://feeds.feedburner.com/ideepercomputeredinternet/zUQN" target="_blank"><span style="color: #003366; font-size: 18px;">Sottoscrivi i feed di</span> <span style="color: #940f04; font-size: 24px;">Idee per Computer ed Internet</span></a> </div>
<script language="JavaScript">
function blink_one() {
document.getElementById('blink').style.visibility='visible';
setTimeout('blink_two()',1000);
}
function blink_two() {
document.getElementById('blink').style.visibility='hidden';
setTimeout('blink_one()',1000);
}
blink_one();
</script>
dove la prima parte può essere personalizzata come si vuole. L'importante è inserire un contenitore div con id="blink". Il numero 1000 regola la velocità di lampeggiamento. Il valore è in millisecondi, se si aumenta il lampeggiamento sarà più lento. Ecco cosa mostra il codice


Secondo metodo di inserimento con una immagine
In questo caso creiamo una immagine lampeggiante. Questo può essere fatto anche con lo script precedente. Basta cambiare la prima parte del codice.
<div id="blink2" style="text-align: center;">
<a href="
http://feeds.feedburner.com/ideepercomputeredinternet/zUQN" target="_blank"><img src="https://lh5.googleusercontent.com/-GTnWMP0dzfo/ThsSsyrKqqI/AAAAAAAATzs/O3amW2MnLNE/s100/colibr%2525C3%2525AC.gif" /></a></div> <script language="javascript">
function lampeggiamento(){
if(document.getElementById('blink2').style.visibility=="hidden")
{document.getElementById('blink2').style.visibility= "visible"}
else
{document.getElementById('blink2').style.visibility= "hidden"}
}
setInterval('lampeggiamento()',1500);
</script>
Anche in questo caso 1500 rappresenta la velocità.Dopo aver modificato la prima parte, se incollato in Modalità HTML, produce questo effetto


Questa funzionalità credo che sarà molto apprezzata da chi è attento a creare un design originale per il proprio sito. Nel caso si volessero inserire più oggetti lampeggianti in una stessa pagina dobbiamo modificare l'ID blink e utilizzare per esempio blink2, blink3, ecc. Cosa che del resto ho fatto anch'io.




1 commento :

  1. fantastico inserito nel mio forum
    http://lottorinaldogratis.forumfree.it/

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.