Question

我想在不同的屏幕尺寸上添加Class和removeClass。我已经完成了jQuery，它基本上可以在窗口调整大小时使用。但是，在某个像素，大约764px左右，布局显示removeClass函数有效，但addClass函数不起作用。我怎样才能使它有效？以下是我的代码。非常感谢！

function checkWindowSize() {
    if ($(window).width() < 767) {
        $("div.sliderkit").removeClass("newslider-vertical").addClass("newslider-horizontal");
        $('.highlight article ul li:first-child').removeClass('featured');
    } else {
        $("div.sliderkit").removeClass("newslider-horizontal").addClass("newslider-vertical");
        $('.highlight article ul li:first-child').addClass('featured');
    }
}
$(window).load(checkWindowSize);
$(window).resize(checkWindowSize);

Answer 1

试试这个：

$(window).on('load',function(){
if ($(window).width() < 767) {
        $("div.sliderkit").removeClass("newslider-vertical").addClass("newslider-horizontal");
        $('.highlight article ul li:first-child').removeClass('featured');
    } else {
        $("div.sliderkit").removeClass("newslider-horizontal").addClass("newslider-vertical");
        $('.highlight article ul li:first-child').addClass('featured');
    }
});



$(window).on('resize',function(){
if ($(window).width() < 767) {
        $("div.sliderkit").removeClass("newslider-vertical").addClass("newslider-horizontal");
        $('.highlight article ul li:first-child').removeClass('featured');
    } else {
        $("div.sliderkit").removeClass("newslider-horizontal").addClass("newslider-vertical");
        $('.highlight article ul li:first-child').addClass('featured');
    }
});

JQuery addClass和removeClass可以工作，但在某些窗口大小时无法正常运行

1 个答案: