文本从一种颜色闪烁到另一种 css 或 jquery
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22490273/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Text blink from one color to another css or jquery
提问by Za7pi
I would want to blink a text with two different colors:
我想用两种不同的颜色闪烁文本：
For example: blinking a text white-green-white-green-white-green
例如：闪烁文字 white-green-white-green-white-green
I don't mind if jQuery or CSS.
我不介意是 jQuery 还是 CSS。
回答by LOTUSMS
Against my better judgement LOL...You will need to adjust for cross-browser compatibility with webkit, etc
与我更好的判断相反，大声笑...您需要调整与 webkit 等的跨浏览器兼容性
EDITTED TO WORK WITH ALL BROWSERS
编辑为适用于所有浏览器
<a href="#"> text</a>
/* css */
a {
animation-duration: 400ms;
animation-name: blink;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes blink {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
回答by JohanVdR
no support for IE 9: animation-iteration-count
Noteto support non-supporting current browsers you can use Modernizr:
See How do I normalize CSS3 Transition functions across browsers?CSS3 animation-fill-mode polyfill
不支持 IE 9：animation-iteration-count
注意要支持不支持的当前浏览器，您可以使用 Modernizr：请参阅如何规范跨浏览器的 CSS3 转换功能？CSS3 动画填充模式 polyfill
@-webkit-keyframes blink {
from { color: green; }
to { color: white; }
}
@-moz-keyframes blink {
from { color: green; }
to { color: white; }
}
@-ms-keyframes blink {
from { color: green; }
to { color: white; }
}
@-o-keyframes blink {
from { color: green; }
to { color: white; }
}
@keyframes blink {
from { color: green; }
to { color: white; }
}
.blink {
color: green;
-webkit-animation: blink 2s 3 alternate;
-moz-animation: blink 2s 3 alternate;
-ms-animation: blink 2s 3 alternate;
-o-animation: blink 2s 3 alternate;
animation: blink 2s 3 alternate;
}
