Blink not working in Chrome

Question

I am using blink in my application to display error message. The problem is that it's working in Firefox but not in Chrome. I don't know what the problem is. How can I make it to work in Chrome?

It has been deprecated in Chrome https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blink — Pavel Hasala, Jan 26 '21 at 17:39

score 9 · Accepted Answer · answered Mar 26 '13 at 20:55

9

Add following code to your css file,

blink {
-webkit-animation-name: blink; 
-webkit-animation-iteration-count: infinite; 
-webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
-webkit-animation-duration: 1s;
}

answered Mar 26 '13 at 20:55

Kishan_KP

4,488
6
27
46

1

Yes, but it was specifically a question for Chrome, so the answer is correct. – Kae Verens Feb 20 '14 at 20:41

score 7 · Answer 2 · edited Feb 12 '19 at 05:17

7

blink, .blink {
    -webkit-animation: blink 1s step-end infinite;
    -moz-animation: blink 1s step-end infinite;
    -o-animation: blink 1s step-end infinite;
    animation: blink 1s step-end infinite;
}
@-webkit-keyframes blink { 67% { opacity: 0 }}
@-moz-keyframes blink {  67% { opacity: 0 }}
@-o-keyframes blink {  67% { opacity: 0 }}
@keyframes blink {  67% { opacity: 0 }}

edited Feb 12 '19 at 05:17

a stone arachnid

1,272
1
15
27

answered Sep 02 '16 at 08:02

tejas

71
1
1

1

This code will work for crome as well as firefox IE also just add Your text – tejas Sep 02 '16 at 08:03

0x9BD0 · Answer 3 · 2016-11-25T14:12:08.400

5

It is deprecated so you might try to do it with javascript. Here is an example I made out of jquery for you: http://jsfiddle.net/FPsdy/ It is very simple:

window.setInterval(function(){
  $('.blink').toggle();
}, 250);

edited Nov 25 '16 at 14:12

answered Mar 26 '13 at 21:01

0x9BD0

1,542
18
41

score 4 · Answer 4 · answered Mar 26 '13 at 20:55

4

Blink is deprecated, and you should not use it.

http://www.w3.org/wiki/HTML/Elements/blink

answered Mar 26 '13 at 20:55

alxgb

543
8
18

1

It is not deprecated, it has never been part of any standard. What is deprecated is `text-decoration: blink` https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration – Pere Dec 27 '13 at 18:34
Boo... if nothing else it was good for jokes. Great for 404 pages and stuff. "404 Error - You've found a page from 1998 you should not be here" – hobberwickey Apr 08 '15 at 21:08
Would be better suited to a question entitled "Is Blink deprecated, and should I use it?" – Gus Hogg-Blake Oct 25 '19 at 19:38

score 0 · Answer 5 · answered Feb 12 '19 at 05:22

Try adding the following lines of code to your css file.

blink {
   -webkit-animation-name: blink; 
   -webkit-animation-iteration-count: infinite; 
   -webkit-animation-timing-function: cubic- 
    bezierr(1.0,0,0,1.0);
    -webkit-animation-duration: 1s;
  }

This is because many browsers doesn't support few css functions. You should try updating your chrome browser.

score -1 · Answer 6 · answered Jul 29 '19 at 11:18

-1

Only need to import is a jquery.min.js file to use this code.

window.setInterval(function(){
    $('.blink').css("opacity","0.5");
    window.setTimeout(function(){
        $('.blink').css("opacity","1");
    },750);
}, 1500);

answered Jul 29 '19 at 11:18

Venugopal Nogaja

1

-1. This is doable without jQuery. You can use CSS animations, too. Using JavaScript for something that can, and should be done in CSS is a pet peeve of mine. – SuperJumpBros May 12 '21 at 12:15

Blink not working in Chrome

6 Answers6

Linked