当 URL 滚动到某个哈希值时，将 class 添加到 div

Question

我的 URL 哈希更改滚动从

等等。这是整页滚动效果。

我想做的是在 URL 滚动到 #section 时将 class .draw-shirt 添加到 div #shirt --2.

我试过这段代码：

$(document).ready(function () {

        if (window.location.href.indexOf("emotion--2") > -1) {
            $('#shirt').addClass('draw-shirt');
        }
    });
        
        

$(window).scroll(function () {
    
        function locationHashChanged() {
            if(window.location.href.indexOf("emotion--2") > -1) {
                $('#shirt').addClass('draw-shirt');
             }
        }

    });

它正在工作，如果 URL www.website.com#section--2 加载但不滚动。

代码

function isScrolledIntoView(elem) {...etc...

由于全页滚动效果，此处无法正常工作。

感谢您的帮助。

Answer 1

我认为您可以使用 window 对象的 native hashchange 事件。

window.addEventListener('hashchange', function() {
    if (location.hash === '#emotion--2') {
        // your code to add class
   } 
});

当 URL 滚动到某个哈希值时，将 class 添加到 div

When URL changes on scroll to a certain hash, add a class to a div

javascript

jquery

onscroll

hashchange