jQueryでウィンドウのサイズが正しく動作しない

Question

ウィンドウの読み込み時にクラスを削除し、幅が992ピクセルより大きい場合はサイズを変更し、992ピクセル未満の場合はクラスを追加するjQuery関数があります。

ただし、ウィンドウサイズを992から1010pxに増やすと、クラスは追加されたままです。 1011pxで削除されます。

jQuery(document).ready(function($){ 

$(window).on('resize', function() { 
if($(window).width() > 992) { 
    $('.bid-overlay-booking').removeClass('fancyboxID-booking'); 
} 
else{ 

    $('.bid-overlay-booking').addClass('fancyboxID-booking'); 
} 
}).resize(); 
}); 

Answer 1

私は同じようにしばらく前に取り組んでいました。ここに私のkludgeの修正がありました。

var windowHeight = 460; 
var windowWidth = 800; 
if (document.body && document.body.offsetWidth) { 
    windowHeight = document.body.offsetHeight; 
    windowWidth = document.body.offsetWidth; 
} 
if (document.compatMode == 'CSS1Compat' && document.documentElement && document.documentElement.offsetWidth) { 
    windowHeight = document.documentElement.offsetHeight; 
    windowWidth = document.documentElement.offsetWidth; 
} 
if (window.innerWidth && window.innerHeight) { 
    windowHeight = window.innerHeight; 
    windowWidth = window.innerWidth; 
} 

if(windowWidth > 992) { 
    $('.bid-overlay-booking').removeClass('fancyboxID-booking'); 
} 
else{ 

    $('.bid-overlay-booking').addClass('fancyboxID-booking'); 
}