Blinking text using HTML in 2020

Enhancement of text, together with blinking text HTML characters

Blinking text is on of the kinds of text decoration which are generally recommended to not use. Like flashy colours and skipping cartoons, making it tough to see the page, this is regarded as a porn effect. Also you must be aware that blinking text is not supported by all browsers.

Blinking text is currently possible in two ways, with HTML, and none of them are really suitable, since they only work for some browsers:

The initial one is STYLE=”text-decoration: blink”. Style has to be used to a text segment, e.g. <P>, <DIV> and <SPAN>. The manner text decorations are usually utilised in a text, <SPAN> will often be a decent solutions as it will not add any additional formatting to text.
A Bit of text that is broadcasting will looke like that as code:

HTML

Here the text is normal, <SPAN STYLE="text-decoration:blink"> here the text blinks, if the browser
support this,</SPAN> and here the text returns to normal.

On the page, when shown, it will look like this:

Blinking text
Blinking text

The other way of doing it is the tag <BLINK>. It is used like other tags with a start and end tag.

A piece of text, containing blinking text html, will look like this as code:

HTML

Here the text is normal, <BLINK>here the text blinks, if the browser support this,
</BLINK> and here the text returns to normal.

On the page, when shown, it will look like this

Workaround for Archiving blinking text HTML (that works)

If you really want to have text, and it’s to function, You’ve Got two basic ways of doing this:

  • A animated gif, i.e. the text has been altered into a picture and added, with the label IMG. This can be done, may be seen under pictures
  • A JavaScript specifying a new label

Let us take a better look in the JavaScript. It’s possible to produce your own component, we will call it JavaBlink, also it appears to be an ordinary label, once you employ it, i.e. <JavaBlink>Blinking text here</JavaBlink>. Because of this we make a job, also known as JavaBlink. Element and operate do not need to possess exactly the exact same title, but for this specific purpose, it’s quite sensible.

The script looks like this:

JS

<SCRIPT type="text/javascript">
  function JavaBlink() {
     var blinks = document.getElementsByTagName('JavaBlink');
     for (var i = blinks.length - 1; i >= 0; i--) {
        var s = blinks[i];
        s.style.visibility = (s.style.visibility === 'visible') ? 'hidden' : 'visible';
     }
     window.setTimeout(JavaBlink, 1000);
  }
  if (document.addEventListener) document.addEventListener("DOMContentLoaded", JavaBlink, false);
  else if (window.addEventListener) window.addEventListener("load", JavaBlink, false);
  else if (window.attachEvent) window.attachEvent("onload", JavaBlink);
  else window.onload = JavaBlink;
</SCRIPT>

The script has to be placed somewhere on the page, before the tag, or called as an external script. Wwe can now use the new tag like this

On the screen, it looks like this:Here the text is normal, here the text blinks, using the JavaScriptet, and here the text returns to normal.

You can now play around with the blinking speed of the text, or whatever else you have placed in the tag.

Just for fun watch the funny cats compilation:

Leave a Reply