跨浏览器闪烁文本
跨浏览器闪烁文本
提问于 2011-02-04 12:12:00
我想发一条闪烁的短信。
首先，我尝试了Mozilla HTML标记，但只有Mozilla Firefox支持它。
然后我尝试了CSS：
<style>
.blink {text-decoration: blink; }
</style>它在IE 6上不起作用。
然后我尝试了javascript：
<script type="text/javascript">
function doBlink() {
// Blink, Blink, Blink...
var blink = document.all.tags("BLINK")
for (var i=0; i < blink.length; i++)
blink[i].style.visibility = blink[i].style.visibility == "" ? "hidden" : ""
}
function startBlink() {
if (document.all)
setInterval("doBlink()",500)
}
window.onload = startBlink;
</script>现在它不能在Safari或Chrome上运行了。
有没有人可以帮助我使用闪烁的文本，它可以在所有不同的流行浏览器上运行？(比如6，Mozilla Firefox，Google Chrome Safari，Opera。)
回答 10
Stack Overflow用户
回答已采纳
发布于 2011-11-30 05:46:34
这可以使用CSS3来实现，如下所示
@-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;
}它甚至有一个很好的淡入淡出效果。在Safari中运行良好，但Chrome在内部有点哭。
Stack Overflow用户
发布于 2013-06-20 08:41:11
真正的跨浏览器/传统浏览器闪烁标记...
HTML
<!DOCTYPE html>
<html>
<blink>ULTIMATE BLINK TAG!</blink>
<!--[if lt IE 10]>
<script>
toggleItem = function(){
var el = document.getElementsByTagName('blink')[0];
if (el.style.display === 'block') {
el.style.display = 'none';
} else {
el.style.display = 'block';
}
}
setInterval(toggleItem, 1000);
</script>
<![endif]-->
</html>CSS
blink {
-webkit-animation: blink 1s steps(5, start) infinite;
-moz-animation: blink 1s steps(5, start) infinite;
-o-animation: blink 1s steps(5, start) infinite;
animation: blink 1s steps(5, start) infinite;
}
@-webkit-keyframes blink {
to { visibility: hidden; }
}
@-moz-keyframes blink {
to { visibility: hidden; }
}
@-o-keyframes blink {
to { visibility: hidden; }
}
@keyframes blink {
to { visibility: hidden; }
}Stack Overflow用户
发布于 2013-08-12 06:32:16
var el = $(".blink");
setInterval(function() {el.toggle()}, 500);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4894488
复制相关文章
相似问题
腾讯云开发者
