Sustituir blink con JavaScript

 La etiqueta blink, es utilizada en ocasiones para mostrar un texto parpadeando.

También se puede utilizar el valor blink de la propiedad text-decoration, que podemos asignar a un texto por medio de un estilo CSS.


El problema con utilizar la etiqueta o valor blink es que no funciona con Internet Explorer.

Les voy a mostrar 3 formas que podemos sustituir blink con JavaScript.

Forma 1:

Ir a Diseño, Elementos de la página (vieja interfaz) y añadir un gadget HTML/Javascript.

Poner el siguiente código:

<div id='blink' style="text-align:center;">

<a href="http://vitua.blogspot.com/" target="_blank"><span style="color: red;font-size:18px;">Visite:</span> <span style="color: blue;font-size:24px;">VituaRadio</span></a>

</div>

<script language="JavaScript">
function blink_uno() {
document.getElementById('blink').style.visibility='visible';
setTimeout('blink_dos()',1000);
}
function blink_dos() {
document.getElementById('blink').style.visibility='hidden';
setTimeout('blink_uno()',1000);
}
blink_uno();
</script>

Lo que pongas dentro del div con la ID blink va a parpadear.

Puede ser texto, imagen, etc...

Yo en el ejemplo puse un enlace centrado con distinto tamaño y color en el texto.

La velocidad se regula cambiando 1000, cuando mayor sea el numero mas lento será.
(1000 = 1 Segundo.)

Ejemplo:

Visite: VituaRadio

---

Forma 2:

Es como la anterior forma, pero cambiando un poco el código.

Código 2:

<div id="vku_blink" style="text-align: center;">

<a href="http://vitua.blogspot.com/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzXy_SxbqdDp84-Ie65qvIESGjNRca3-27AsPkunHjuMonDxlNDklggX0OgwHtIlfMw1868kBKXpkV1OtwkD6HEsVIrQYnxxVZpy-f38lluRJpyGiOWAq9de_f-bJo1YfAyTjel8p_Fxoz/s1600/VituaR.png"/></a></div>
<script language="javascript">
function parpadeo(){
if(document.getElementById('vku_blink').style.visibility=="hidden")
{document.getElementById('vku_blink').style.visibility= "visible"}
else
{document.getElementById('vku_blink').style.visibility= "hidden"}
}
setInterval('parpadeo()',1500);
</script>

Acá le cambie la ID, la velocidad (es un poco mas lento) y muestro una imagen con enlace.

Ejemplo 2:

---

Forma 3:

Este código es distinto ya que podemos hacer el efecto todas las veces que se quiera utilizando el mismo script, solo hay que ir cambiando la ID.

Ir a Diseño (vieja interfaz) o Plantilla (nueva interfaz),

Edición de HTML.

Y justo arriba de </head>

Poner el siguiente código:

<script language="javascript">
function vku_parpadeo(otro) {
var el = document.getElementById(otro);
if ( el.style.visibility != 'hidden' ) {
el.style.visibility = 'hidden';
}
else {
el.style.visibility = 'visible';
}
}
</script>

Y en donde quieramos mostrar el efecto ponemos así:

<script>setInterval('vku_parpadeo("asocia1")',2000);</script>
<div id="asocia1" style="color: red; text-align: center;">
Texto que aparece y desaparece</div>

Acá utilizo la ID asocia1, que tiene que ser igual en el script y en el div.

Texto que aparece y desaparece con ID asocia1

Otro ejemplo con la ID asocia2

También le cambie el color del texto utilizando estilo CSS y la velocidad (4000).

Texto que aparece y desaparece con ID asocia2