浏览器缩放检测的js代码-js教程-PHP中文网

浏览器缩放检测的js代码

PHPz

发布： 2016-05-16 16:35:07

转载

1672人浏览过

这篇文章主要介绍了浏览器缩放检测的js代码,需要的朋友可以参考下。

测试代码

http://jsbin.com/dipijeqi/11

效果：

chrome：

window.devicePixelRatio : 2  (准确)
screen.deviceXDPI / screen.logicalXDPI : NaN
window.outerWidth / window.innerWidth : 2
document.documentElement.offsetHeight / window.innerHeight : 0.020618556701030927 (有相关性)
window.top.outerWidth / window.top.innerWidth : 2

登录后复制

ff：

window.devicePixelRatio : 1.5 (准确)
screen.deviceXDPI / screen.logicalXDPI : NaN
window.outerWidth / window.innerWidth : 1.0114583333333333
document.documentElement.offsetHeight / window.innerHeight : 0.023391812865497075  (有相关性)
window.top.outerWidth / window.top.innerWidth : 1.0114583333333333

登录后复制

ie 8：

window.devicePixelRatio : undefined
screen.deviceXDPI / screen.logicalXDPI : 1.5416666666666667 (大致准确)
window.outerWidth / window.innerWidth : NaN
document.documentElement.offsetHeight / window.innerHeight : NaN
window.top.outerWidth / window.top.innerWidth : NaN

登录后复制

ie11：

现代化家居响应式网站模板1.0

现代化家居响应式网站模板源码是以cmseasy进行开发的家居网站模板。该软件可免费使用，模板附带测试数据！模板源码特点：整体采用浅色宽屏设计，简洁大气，电脑手机自适应布局，大方美观，功能齐全，值得推荐的一款模板，每个页面精心设计，美观大方，兼容各大浏览器；所有代码经过SEO优化，使网站更利于搜索引擎排名，是您做环保类网站的明确选择。无论是在电脑、平板、手机上都可以访问到排版合适的网站，即便是微信等

查看详情

window.devicePixelRatio : 1.5 (准确)
screen.deviceXDPI / screen.logicalXDPI : 1.5window.outerWidth / window.innerWidth : 1.0084033613445377document.documentElement.offsetHeight / window.innerHeight : 0.02203856749311295 (有相关性)window.top.outerWidth / window.top.innerWidth : 1.0084033613445377

登录后复制

ie10：

window.devicePixelRatio : undefined
screen.deviceXDPI / screen.logicalXDPI : 1.5 (准确)
window.outerWidth / window.innerWidth : 1.0084033613445377
document.documentElement.offsetHeight / window.innerHeight : 1
window.top.outerWidth / window.top.innerWidth : 1.0084033613445377

登录后复制

ie9：

window.devicePixelRatio : undefined
screen.deviceXDPI / screen.logicalXDPI : 1.5 (准确)
window.outerWidth / window.innerWidth : 1.0084033613445377
document.documentElement.offsetHeight / window.innerHeight : 1
window.top.outerWidth / window.top.innerWidth : 1.0084033613445377

登录后复制

360 6.3(完全没反应)：

window.devicePixelRatio : undefined
screen.deviceXDPI / screen.logicalXDPI : 1
window.outerWidth / window.innerWidth : NaN
document.documentElement.offsetHeight / window.innerHeight : NaN
window.top.outerWidth / window.top.innerWidth : NaN

登录后复制

360极速浏览器：

window.devicePixelRatio : 1
screen.deviceXDPI / screen.logicalXDPI : NaN
window.outerWidth / window.innerWidth : 1.5
document.documentElement.offsetHeight / window.innerHeight : 0.015267175572519083
window.top.outerWidth / window.top.innerWidth : 1.5(准确)

登录后复制

搜狗高速浏览器 (完全没反应)：

window.devicePixelRatio : undefined
screen.deviceXDPI / screen.logicalXDPI : 1
window.outerWidth / window.innerWidth : NaN
document.documentElement.offsetHeight / window.innerHeight : NaN
window.top.outerWidth / window.top.innerWidth : NaN

登录后复制

淘宝浏览器：

window.devicePixelRatio : 1
screen.deviceXDPI / screen.logicalXDPI : NaN
window.outerWidth / window.innerWidth : 2.0710059171597632  (大致准确)
document.documentElement.offsetHeight / window.innerHeight : 0.022988505747126436
window.top.outerWidth / window.top.innerWidth : 2.0710059171597632

登录后复制

以上就是本章的全部内容，更多相关教程请访问JavaScript视频教程！