移动 Web 开发 4 行代码检测浏览器是否支持 position:fixed
不废话,直接上代码
var div = document.createElement('div');
div.style.cssText = 'display:none;position:fixed;z-index:100;';
body.appendChild(div);
console.log(window.getComputedStyle(div).position != 'fixed');
对于不支持 fixed 的浏览器,window.getComputedStyle(div).position
计算出来的值会是 absolute
。
在这段代码的基础上,可以封装一个公共函数,并将已知的不支持 position: fixed 浏览器直接过滤掉,简单方便调用。
function isSupportFixed() {
var userAgent = window.navigator.userAgent,
ios = userAgent.match(/(iPad|iPhone|iPod)\s+OS\s([\d_\.]+)/),
ios5below = ios && ios[2] && (parseInt(ios[2].replace(/_/g, '.'), 10) < 5),
operaMini = /Opera Mini/i.test(userAgent),
body = document.body,
div, isFixed;
div = document.createElement('div');
div.style.cssText = 'display:none;position:fixed;z-index:100;';
body.appendChild(div);
isFixed = window.getComputedStyle(div).position != 'fixed';
body.removeChild(div);
div = null;
return !!(isFixed || ios5below || operaMini);
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论