Question

我有一个使用

基于屏幕大小运行的脚本

if (document.documentElement.clientWidth >= 1024) {//script}

这种方法很好，但需要在更改之间刷新，因为这将在移动网站上使用，我需要查看方向是否发生变化。

如何在不刷新的情况下检测屏幕大小？

Jsfiddle demo

Answer 1

试试这个：

$(window).resize(function() {
    if (document.documentElement.clientWidth >= 1024) {    
        $('div').click(function() {
            $('p').slideToggle();
        });
    }
}).resize()

<小时/> 更新

您可以使用orientationchange事件：

$(window).bind('orientationchange', check);

function check() {
     if (document.documentElement.clientWidth >= 1024) {    
            $('div').click(function() {
                $('p').slideToggle();
            });
     }
}

Answer 2

function calculateHeight(){ 
   //do some calculations

}

calculateHeight();

$(window).resize(function(){
    calculateHeight();  
});

这是你的游戏。在calculateHeight中，您可以编写计算代码，然后运行一次以使所有内容都具有正确的大小。之后$（windows）.resize（）;每次调整窗口大小时调用，以便您可以再次计算。

Answer 3

你可以试试jQuery resize（）方法： http://api.jquery.com/resize/

jQuery检测屏幕化更改而不刷新

3 个答案: