判断浏览器，各浏览器页面高度自适应（平铺），各浏览器自适应去除滚动条，浏览器分辨率自适应

最新推荐文章于 2022-09-19 11:30:22 发布

麦兜_冰夕

最新推荐文章于 2022-09-19 11:30:22 发布

阅读量1.3k

点赞数

分类专栏：浏览器兼容问题响应式布局文章标签： JavaScript 浏览器兼容浏览器自适应浏览器分辨率自适应

本文链接：https://blog.csdn.net/lyn1772671980/article/details/78520772

版权

浏览器兼容问题同时被 2 个专栏收录

35 篇文章 1 订阅

订阅专栏

响应式布局

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src = "jquery-1.11.0.min.js"></script>
</head>
<style>
body,html{
padding:0px;
margin:0px;
}
.containner{
width: 100%;
background-color: green;
}
</style>
<body>
<div class = "containner"></div>
</body>
<script type="text/javascript">
var screenHeight = window.screen.height;
var availHeight = window.screen.availHeight;
var heightnum = heightNum();
$(".containner").css("height",heightnum);
function myBrowser(){
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
if (userAgent.indexOf("Firefox") > -1) {
return "FF";
} //判断是否Firefox浏览器
if (userAgent.indexOf("Chrome") > -1){
return "Chrome";
}
if(!!window.ActiveXObject || "ActiveXObject" in window){
return "IE";
}//判断是否IE浏览器

}
function heightNum(){
var height;
var mb = myBrowser();
if ("IE" == mb) {
height = availHeight-78
}
if ("FF" == mb) {
height = availHeight-93
}
if ("Chrome" == mb) {
height = availHeight-66
}
return (height+"px")
}

</script>
</html>