js动态获取窗口大小

我想根据用户浏览器的窗口大小，判断是是否显示侧边栏，用了以下代码：
<script type="text/javascript">
function show()
{
    var w = document.body.clientWidth;
   
    if (w < 980)
        document.getElementById('sidebar').style.display = 'none';
}
window.onload  = show
</script>也就是说当用户打开网页时，就会判断用户浏览器的窗口宽度是否小于980px，是则不显示侧边栏。但是这样的判断只在窗口打开的时候进行一次，在用户浏览该网页的过程中可能会手动改变窗口大小，如最大化。我想让程序根据用户浏览器窗口宽度的变化，自动地 显示 / 隐藏 侧边栏，能否做到？

解决方案 »

  1.   

    <script type="text/javascript">
    function show()
    {
        var w = document.body.clientWidth;
       
        if (w < 980){
            document.getElementById('sidebar').style.display = 'none';
        }
        else{
             document.getElementById('sidebar').style.display = 'block';
        }
            
    }
    window.onload  = show;
    window.onresize = show;
    </script>
      

  2.   


    js隐藏div有一段延迟时间，也就是说，都等到侧边栏显示出来了，才会被js隐藏掉。有没有好的解决办法，判断窗口尺寸是否小于980px，如果是就直接不让浏览器解析侧边栏的html代码，而不是等浏览器全部解析完了，采取把它隐藏？
      

  3.   

    首先楼主应该用
    网页可见区域宽：document.body.clientWidth
    网页可见区域高：document.body.clientHeight
    来获取数据，判断你可以自己写，当窗体变化的时候会自动的调用一个函数叫<body onresize="">onresize函数
    楼主可以测试一下，这样判断resize之后的窗体大小来判断是否隐藏就可以了
      

  4.   

    js如何获取窗口宽度的变化，注意不是获取宽度，而是判断宽度是否变化来产生想要的行为（高度不用判断）
    比如onresize是窗口宽度和高度只要有一项变化就产生动作，现在只想检测宽度变化，根据宽度变化产生动作