javascript - Checking if window size has changes and performance/optimalization

Question

today I'm implementing slider plugin and I have one question about it:

I want to make it responsive, but to achive that (depending on my current implementation) I should add another function which will detect if browser window size has changed - and here's my question - is it good for overall performance? Or maybe I should re-think about my solution and try to build it with pure css?

Answer 1

浏览器调整大小只是暂时的，就我个人而言，我认为在那个阶段出现轻微的小问题并不会有很大的麻烦。

由于您引用 jquery，您可以添加

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

在准备好文档的情况下添加它，您可以在加载时调用它。做就是了

$(window).resize();

就性能而言，您是正确的，每个小插件都会对性能产生影响，但前提是它处于活动状态。当窗口未调整大小时，不会触发事件。

Answer 2

<div id="resized"></div>

function display() {
    var p = document.createElement("p");

    p.textContent = "resize event";
    document.getElementById("resized").appendChild(p);
}

$(window).on("resize", display);

或使用 javascript

function display() {
    var p = document.createElement("p");

    p.textContent = "resize event";
    document.getElementById("resized").appendChild(p);
}

window.addEventListener("resize", display, false);

在jsfiddle上