Question

我的标题中有一个固定的黑色填充svg徽标，当它滚动到页面下方的一个黑暗的全宽容器div时，我想填充白色。这就是HTML的结构：

<header class="header">
    <a href=">
        <svg class="logo__container">
            <g class="logo"></g>
        </svg>
    </a>
</header>

.logo__container {
    width: 200px;
    height: 150px;
}

.logo {
    color: #000000;
}

我只是在它滚动特定的div时才尝试添加说.logo__white。此徽标的工作方式排序http://www.dtelepathy.com/philosophy/

Answer 1

如果我理解正确，当你的滚动/页面位置与div的开头位于同一点时，你想要为div添加一个类。你可以用jQuery做到这一点。

$(window).scroll(function (event) { // when the page is being scrolled
    var scroll = $(window).scrollTop(); // define current scroll height
    var divHeight = $('.div-name').height(); // define position (height) of the div

    if (scroll > divHeight) { // if the current scroll is higher than the div height
        $('.div-name').addClass('class-name'); // add class name
    }
});

E：确保在项目中包含jQuery

滚动

1 个答案: