请在此处查看我的代码: http://jsfiddle.net/gt4Rj/
我想让这个东西淡出然后淡入。它工作得很好,就像我希望它在 Firefox 和 IE 上一样。但它在 Chrome 上显示了一个奇怪的“闪烁”。 我已使 fadeOut 和 fadeIn 尽可能简单。但似乎没有任何原因。
HTML:
<body>
bbbbbbb
</body>
JS:
jQuery('body')
.addClass('fixed-top fadeIn')
.fadeOut(1000).fadeIn(1000);
CSS:
.fixed-top {
background:transparent;
overflow: hidden;
z-index: 10;
}
@-webkit-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
.fadeIn {
-webkit-animation-duration: 1s;
-webkit-animation-fill-mode: backword;
-webkit-animation-name: fadeIn;
}
最佳答案
此问题是由于您为 .fadeIn
添加的动画持续时间 css 引起的。删除持续时间 css,一切都会完美运行。
.fadeIn {
-webkit-animation-fill-mode: backword;
-webkit-animation-name: fadeIn;
}
关于javascript - jQuery fadeIn fadeOut "blink"在 Chrome 上,在 FireFox 和 IE 上工作正常,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20561669/