技术探索

jQuery使层自适应浏览器高度

2015-08-10
466

使用jQuery使页面中指定的层自适应浏览器高度的代码,备查。

 

//初始加载时执行
$(document).ready(function () { $('#div_body').css('height', $(window).height()); });
//浏览器改变大小时执行
$(window).resize(function () { $('#div_body').css('height', $(window).height()); })

 

相应的html页面:

<body>
    <div id="div_body" style="width: 200px; background: #ff6600;">层的高度将根据浏览器的高度而变化</div>
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () { $('#div_body').css('height', $(window).height()); });
        $(window).resize(function () { $('#div_body').css('height', $(window).height()); })
    </script>
</body>