如何在调整大小的同时获得屏幕宽度和高度？

Question

我有跟随脚本，它确实获得了屏幕宽度/高度，但它只在页面刷新后才这样做;

function getWidth(){
    if(self.innerWidth){
        return self.innerWidth; 
    }

    if(document.documentElement && document.documentElement.clientHeight){
        return documentElement.clientWidth; 
    }

    if(document.body){
        return document.body.clientWidth;
    }
}

我想知道是否有其他替代方法可以获得浏览的屏幕宽度/高度。

Answer 1

有人提到你可以使用调整大小监听器。以下是我在自己的代码中使用的示例：

<script>
        //allow global access to vars height and width, but protect namespace
        var Frame = {width:0,height:0};
        //function to get current height and width
        function getFrameSize() {              
            Frame.height = window.innerHeight;
            Frame.width = window.innerWidth;
        } 
        //set listeners to resize automatically 
        window.addEventListener('resize', getFrameSize);
        window.addEventListener('load', getFrameSize);             
    </script>

这将保持窗口内部尺寸的实际高度和宽度存储在Frame.height和Frame.width中，并通过每次调整窗口大小时重新检查来使值保持最新。