Удалить метку стиля и стиля при изменении размера окна

Question

Я хотел бы удалить класс showMenu из #menu ul и #style2 тег при размере окна больше 1000 пикселей.

Мой код:

$(function() { 
    if (window.screen.width > 1000) { 
    $("#menu ul").removeClass("showMenu"); 
    $("#menuicon").removeClass("active"); 
    $("#style2").remove(); 
    } 
}); 

Я не знаю, почему он снимает все сразу, а не после того, как экран изменения размера для 1001PX ...

Answer 1

Потому что он проверяет экрана ширина только один раз, после того, как погрузка. Для того, чтобы сделать эту работу каждый раз, когда на экране изменяется, это должно идти в $(window).resize():

Update: Вы должны проверить с window.innerWidth не с window.screen.width.

$(function() { 
    $(window).resize(function() { 
    if (window.innerWidth > 1000) { 
     $("#menu ul").removeClass("showMenu"); 
     $("#menuicon").removeClass("active"); 
     $("#style2").remove(); 
    } 
    }); 
}); 

Я также верю, что вы хотите вернуть его обратно сразу становится нормальным:

$(function() { 
    $(window).resize(function() { 
    if (window.innerWidth > 1000) { 
     $("#menu ul").removeClass("showMenu"); 
     $("#menuicon").removeClass("active"); 
     $("#style2").remove(); 
    } else { 
     $("#menu ul").addClass("showMenu"); 
     $("#menuicon").addClass("active"); 
     $("#style2").remove(); // I don't know how to do this! `:P` 
    } 
    }); 
});