不同于Jquery，当宽度屏幕为1050px时，删除类 [英] Different from Jquery, Remove class when width screen is 1050px

问题描述

OK现在我知道如何删除abd添加类与窗口的宽度。

OK i know now how to remove abd add class with the width of the window.

但现在我在努力解决这个问题：

But now i'm struggling with this issue:

我想要这样：

 var num = 90; //number of pixels before modifying styles

$(window).bind('scroll', function () {
    if ($(window).scrollTop() > num) {
        $('#menu2').addClass('f-nav');
    } else {
        $('#menu2').removeClass('f-nav');
    }
});

可使用此功能：

function checkWidth() {
    if ($(window).width() > 1049) {
        $('#menu2').addClass('f-nav');
    } else {
        $('#menu2').removeClass('f-nav');
    }
}

$(window).resize(checkWidth);

换句话说，

我下滚它必须添加一个类，但是当它调整大小它必须删除类+它也必须删除，当向上滚动。

When i scrolldown it must add a class, but when it resizes it must remove the class + it also has to be removed when i scroll up.

推荐答案

根据你的评论@ Lashus的回答

According to your comment @Lashus's answer

|      | > 1050px | < 1050px |
+----------------------------+
| top  | -        | -        |
| down | + f-nav  | - f-nav  |

这意味着，在顶部不做任何操作，但添加或删除 $

This means, do nothing at the top, but add or remove f-nav, when scrolled down

$(window).bind('scroll', function () {
    if ($(window).scrollTop() > num)
        checkWidth();
});

JSFiddle

另请注意 .bind（） 与 .on（）

从jQuery 1.7开始，.on（）方法是将事件处理程序附加到文档的首选方法。

As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document.

这篇关于不同于Jquery，当宽度屏幕为1050px时，删除类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！