Question

基本上，当我开始向下滚动时，我的网站上有一个标题，从透明变为背景白色。它在开始滚动时添加了一个类头 - 固定。当标题是固定标题或不是标题时，我试图在两个标识之间切换。这是我现在拥有的jQuery，我无法开始工作：

<img class="bdanzer-normal" src="https://dummytext">
                <img class="bdanzer-fixed" src="https://dummytext">

编辑，添加HTML：

class MyTuple(object):
    def __init__(self, iterable):
        self.data = tuple(iterable)
    def __getitem__(self, i):
        return tuple.__getitem__(self.data, i)

t = MyTuple((1, 2, 3))
print(t[1])
print(isinstance(t, tuple))

Answer 1

在DOM准备好后，

$(document).ready()仅被调用一次。您只需处理scroll事件而不是ready：

$(window).on('scroll', function(){
    if ($('#masthead').hasClass('header-fixed')) {
        $('.bdanzer-fixed').addClass('bdanzer-show');
    } else {
        $('.bdanzer-fixed').removeClass('bdanzer-show');
    }
});

但是在一个地方处理scroll以添加一个类，然后处理scroll以查找此类并将另一个类添加到另一个元素并不好。最好只有一个scroll处理程序，它将完成滚动所需的所有操作，并添加/删除所有必需的类。

Answer 2

也可以使用toggleClass函数进行简化：

$(document).on('scroll', function(){
    var hasClass = $('#masthead').hasClass('header-fixed'));
        $('.bdanzer-fixed').toggleClass('bdanzer-show', hasClass );
});

尝试使用jquery切换标头中的徽标以添加/删除类

2 个答案: