HTML标签,在支持它的浏览器(如Mozilla Firefox和Opera)中,使其内容时断时续地闪烁,类似于慢速频闪灯的效果。
我正在为非标准的超文本标记语言编写一套多层填充,包括blink
标记。闪烁行为的实现非常简单
(function blink(n) {
var blinks = document.getElementsByTagName("blink"),
visibility = n % 2 === 0 ? "visible" : "hidden";
for (var i = 0; i < blinks.length; i++) {
blinks[i].style.visibility = visibility;
}
setTimeout(function() {
blink(n + 1);
}, 500);
})(0);
(您可以使用see this in action)
但这不会检测浏览器是否已经支持blink
标记,并且在已经支持它的浏览器中,将会有双眼闪烁的效果。我需要一些功能检测来确定浏览器是否支持闪烁,如果不支持,它就会依赖于我的Javascript polyfill。
我不想做浏览器检测,因为这个解决方案是不可伸缩的,而且由于人们可以在他们的火狐偏好中禁用blink
行为,所以这个解决方案是无效的。
有没有办法检测对blink
元素的支持?
发布于 2012-04-21 08:04:55
我只是对这个问题做了一点研究,我想我可能会找到一个答案……
我相信你知道CSS属性支持检测?好吧,这里有一个text-decoration: blink
CSS属性。因此,如果浏览器支持<blink>
,那么它也必须支持CSS属性!
这是正常的CSS属性检测,即要检测是否支持textDecoration
,请执行以下操作:
if (document.createElement("detect").style.textDecoration === "") {
// textDecoration supported
}
也许你可以试试这样的方法:
if (document.createElement("detect").style.textDecoration === "blink") {
// textDecoration: blink supported ?
}
或者沿着这些路线。
更新
我有4个浏览器&所以用4个浏览器测试了一下。在这4个标签中,只有FireFox支持闪烁标签。在FF中,<blink>
在HTML文档中被注册为"Span“元素,但在其他3种浏览器中,它被注册为unknown
元素。
<html>
<head>
<script type="text/javascript">
function investigate() {
var blinker = document.getElementsByTagName("blink")[0];
document.getElementById("monitor").innerHTML += blinker;
}
</script>
</head>
<body onload="investigate()">
<blink>Hello, blink!</blink>
<div id="monitor"> </div>
</body>
</html>
输出
不支持的Internet Explorer 7,8,9
你好,眨眼!
对象
Chrome 18 不支持
你好,眨眼!
对象HTMLUnknownElement
不支持 Safari 5
你好,眨眼!
对象HTMLElement
支持FireFox 3.6 的
你好,眨眼!
object HTMLSpanElement
https://stackoverflow.com/questions/10248923
复制相似问题