web-dev-qa-db-ja.com

Chrome

アプリケーションでblinkを使用してエラーメッセージを表示しています。問題は、Firefoxでは機能するがChromeでは機能しないことです。何が問題なのかわかりません。 Chromeで動作させるにはどうすればよいですか?

19
aizaz

次のコードをcssファイルに追加します。

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;
}
8
Kishan_KP
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 }}
6
tejas

これは非推奨であるため、JavaScriptを使用して試してみてください。ここに私がjqueryからあなたのために作った例があります: http://jsfiddle.net/FPsdy/ とても簡単です:

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

Blinkは非推奨であり、使用しないでください。

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

4
alxgb

次のコード行をcssファイルに追加してみてください。

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;
  }

これは、多くのブラウザーが少数のcss関数をサポートしていないためです。 chromeブラウザを更新してみてください。

0
Deril Raju

このコードを使用するには、インポートする必要があるのはjquery.min.jsファイルだけです。

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