窗口调整大小

时间:2017-03-24 15:32:01

标签: javascript events window-resize will-change

onresize可用于知道窗口已调整大小。在窗口调整大小之前是否有任何类似的通知/事件。 我希望在窗口调整大小开始之前设置一些元素的更改,然后在窗口调整大小后删除它。

2 个答案:

答案 0 :(得分:1)

调整大小之前没有任何事件会触发。仅在调整大小时。大多数在rezise上执行某些操作的解决方案使用setTimeout来检查自上次调整大小事件以来经过一定时间的时间。所以我猜你运气不好。

答案 1 :(得分:1)

似乎没有直接的解决方案,但是可以使用window.addEventListener("resize",yourFunction);和一些全局变量通过一些解决方法来实现start | end事件(这是一种解决方法,并不完美)。

//Accesible variables
var atStart = true;
var timer;

function yourFunction(){
    return ()=>{
        if(atStart){
          console.log("START");
          //Some code to be executed once at start
          atStart = false;
        }
        console.log("WHILE");
        //Some code to be executed while resizing

        if (timer) clearTimeout(timer);
        timer= setTimeout(atEnd, 500);
    }
}

function atEnd(){
    //Some code to be executed at the end of resizing
    //..well some 500ms after the end of resizing
    console.log("END")
    atStart = true;
}

window.addEventListener("resize",yourFunction());

希望它对某人有帮助。