js怎么判断一个浏览器窗口大小而自动添加一个class
请高手指教，最好有代码说明。比如有980px1180px1380px这三种宽度，分别对应class="width-980"class="width-1180"class=...
请高手指教，最好有代码说明。 比如有980px 1180px 1380px这三种宽度，分别对应class="width-980" class="width-1180" class="width-1380" 。如果打开的浏览器低于1000就把width-980放到body中，要是高于1000低于1300的把width-1180放到body中，大于1300的把width-1380放到body中。
<body class="cszd "> 展开
<body class="cszd "> 展开
2个回答
展开全部
<script type="text/javascript">
var winWidth = 0;
var winHeight = 0;
function findDimensions() //函数：获取尺寸
{
//获取窗口宽度
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
//获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测，获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth)
{
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
//这块
//document.body.style.height = winHeight + "px";
//document.body.style.width = winWidth + "px";
document.getElementById("a1111").style.height = winHeight + "px";
document.getElementById("a1111").style.width = winWidth + "px";
}
findDimensions();
//调用函数，获取数值
window.onresize=findDimensions;
</script>
var winWidth = 0;
var winHeight = 0;
function findDimensions() //函数：获取尺寸
{
//获取窗口宽度
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
//获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测，获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth)
{
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
//这块
//document.body.style.height = winHeight + "px";
//document.body.style.width = winWidth + "px";
document.getElementById("a1111").style.height = winHeight + "px";
document.getElementById("a1111").style.width = winWidth + "px";
}
findDimensions();
//调用函数，获取数值
window.onresize=findDimensions;
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
2016-05-17 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
参考下面代码
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" id="sc" type="text/css" href="css/c1.css"/>
<script type="text/javascript">
window.onload=function(){
var sc = document.getElementById("sc");
var d = document.getElementById("d");
if (screen.width > 1024){
sc.setAttribute("href", "css/c2.css"); //设置css引入样式表的路径
} else {
sc.setAttribute("href", "css/c1.css");
}
}
</script>
</head>
<body>
<div id="d"></div>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" id="sc" type="text/css" href="css/c1.css"/>
<script type="text/javascript">
window.onload=function(){
var sc = document.getElementById("sc");
var d = document.getElementById("d");
if (screen.width > 1024){
sc.setAttribute("href", "css/c2.css"); //设置css引入样式表的路径
} else {
sc.setAttribute("href", "css/c1.css");
}
}
</script>
</head>
<body>
<div id="d"></div>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
