JavaScript Javascript:检测和显示页面宽度(适用于调试网站宽度)
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript Javascript:检测和显示页面宽度(适用于调试网站宽度)相关的知识,希望对你有一定的参考价值。
window.onload = function(){setScreenClass()};
window.onresize = setScreenClass;
// Following transition classes will be declared:
//
// classname screenwidth
// ------------------------------------------
// pda_v 240px
// pda_h 320px
// ultralow 320px - 640px
// screen_lo 640px - 800px
// screen_med 800px - 1024px
// screen_hi 1024px - 1280px
// screen_wide > 1280px
function setScreenClass(){
var fmt = document.documentElement.clientWidth;
var cls =
(fmt<=240)?'pda_ver':
(fmt>240&&fmt<=320)?'pda_hor':
(fmt>320&&fmt<=640)?'screen_ultralow':
(fmt>640&&fmt<=800)?'screen_low':
(fmt>800&&fmt<=1024)?'screen_med':
(fmt>1024&&fmt<=1280)?'screen_high':'screen_wide';
document.getElementById('count').innerHTML=fmt+'px -> '+cls;
document.body.className=cls;
};
Add anywhere on page and style if preferred.
<div id="count"></div>
以上是关于JavaScript Javascript:检测和显示页面宽度(适用于调试网站宽度)的主要内容,如果未能解决你的问题,请参考以下文章
JavaScript人脸检测的实现方法
使用 JavaScript 和 Razor 检测移动设备
你如何检测 CSS 动画何时以 JavaScript 开始和结束?
如何使用 javascript 检测浏览器名称和版本? [复制]
检测页面是不是在 JavaScript 中的 WKWebView 中加载
从 Javascript 检测真正的边框、填充和边距