jquery代码像媒体屏幕一样工作

Question

是否有像@media (min-width:768px) {}一样的jQuery代码我试过

$(window).one('resize',function () {
    if ($(window).width() < 800){
        size = true;
        mob();
    }
});
$(window).trigger('resize');

此代码也可以，但是如果我单击一次并重新调整大小就无法正常工作。谁能帮我。是否有jQuery代码像100％@media (min-width:768px) {}

一样工作

Answer 1

请尝试使用媒体查询侦听器：

var mediamatch = window.matchMedia("(min-width: 768px)");
mediamatch.addListener(handleMediaChange);

function handleMediaChange = function (mediaQueryList) {
    if (mediaQueryList.matches) {
         // The browser window is at least 768px wide
    }
    else {
        // The browser window is less than 768px wide
    }
}

仅当宽度超过768px边界时才会触发。

Answer 2

你可以简单地使用它：

$(window).resize(function {
    if ($(window).width() > 768){ // Equals min-width: 768px
        //Your code goes here
    }
});