Blinking text cross browser

后端 未结 11 2356
刺人心
刺人心 2020-12-05 00:55

I want to make a blinking text.

First I tried the HTML tag, but it is only supported in Mozilla Firefox.

Then I tried CSS:

11条回答
  •  遥遥无期
    2020-12-05 01:38

    This can be achieved with CSS3 like so

    @-webkit-keyframes blink {
        from {
            opacity: 1.0;
        }
        to {
            opacity: 0.0;
        }
    }
    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;
    }
    

    It even has a nice fade effect. Works fine in Safari, but Chrome cries a little on the inside.

提交回复
热议问题