javascript - 如何在 JavaScript 中获取准确的媒体查询值？

Question

我使用了 $(window).width() 和 $(window).outerWidth() 但两者都会忽略滚动条。因此，如果滚动条宽度为 15px，那么当媒体查询为 770px 时，$(window).width() 和 $(window).outerWidth() 将为 755px。

Answer 1

jsBin demo

支持得很好，您可以使用matchMedia ^Docs

var mediaQ770 = window.matchMedia('all and (max-width: 770px)');

mediaQ770.addListener(function(ev) {
    if(ev.matches) {
        console.log("<=770");
    } else {
        console.log(">770");
    }
});