js高度宽度自适应

最新推荐文章于 2024-07-19 09:33:15 发布

早退的程序员

最新推荐文章于 2024-07-19 09:33:15 发布

阅读量4k

点赞数

文章标签： javascript js jquery

本文链接：https://blog.csdn.net/qqnbsp/article/details/82997963

版权

1.根据浏览器大小DIV自适应，首先我们需要获取浏览器的高度和宽度。

var autoWidth;
var autoHeight;
function autodivsize(){
    //函数：获取尺寸    //获取浏览器窗口高度
    if (window.innerHeight)
        autoHeight = window.innerHeight;
    else if ((document.body) && (document.body.clientHeight))
        autoHeight = document.body.clientHeight;    //通过深入Document内部对body进行检测，获取浏览器窗口高度
    if (document.documentElement && document.documentElement.clientHeight)
        autoHeight = document.documentElement.clientHeight;    //DIV高度为浏览器窗口的高度

    if (window.innerWidth)
        autoWidth = window.innerWidth;
    else if ((document.body) && (document.body.clientWidth))
        autoWidth = document.body.clientWidth;    //通过深入Document内部对body进行检测，获取浏览器窗口高度
    if (document.documentElement && document.documentElement.clientWidth)
        autoWidth = document.documentElement.clientWidth;    //DIV高度为浏览器窗口的高度
}
window.onresize=autodivheight; //浏览器窗口发生变化时同时变化DIV高度

我们获取到高度和宽度以后，就可以将改高度和宽度设置到div上面了！