Question

我试图通过检测具有特定ID的div来向导航中的链接添加类，每个div位于不同的页面上并位于顶部。

如果我为每个单独的实例使用它，分别更改div和类

$(document).on("scroll ready", function() {
    if ($(this).scrollTop()>=$('#contact').position().top){
        $("#nav .contact a").addClass("ur-here");
    }
});

代码有效，除非我像这样重复使用该代码

$(document).on("scroll ready", function() {
    if ($(this).scrollTop()>=$('#contact').position().top){
        $("#nav .contact a").addClass("ur-here");
    }
});

$(document).on("scroll ready", function() {
    if ($(this).scrollTop()>=$('#blog').position().top){
        $("#nav .blog a").addClass("ur-here");
    }
});

此时只有第一个实例起作用（通过第一个实例，我的意思是它并不重要，我先放哪个部分，其余部分似乎被忽略）。

我也尝试将它们全部包含在一个功能中

$(document).on("scroll ready", function() {
    if ($(this).scrollTop()>=$('#intro').position().top){
        $("#nav .home a").addClass("ur-here");
    }
    else if ($(this).scrollTop()>=$('#services').position().top){
        $("#nav .service a").addClass("ur-here");
    }
    else if ($(this).scrollTop()>=$('#contact').position().top){
        $("#nav .contact a").addClass("ur-here");
    }
    else if ($(this).scrollTop()>=$('#blog').position().top){
        $("#nav .blog a").addClass("ur-here");
    }
});

但是只有第一个实例才有效。

我也试过转出

$(document).on("scroll ready", function() {

与

$(document).ready(function() {

和

$(window).load(function() {

具有类似的结果，除非我使用

$(window).load(function() {

在第二个实例中，代码适用于它和第一个，但是无论我使用什么，它都会继续忽略其余部分。

请帮助

编辑

如果有帮助的话，它是一个wordpress网站

解决

我只是针对个人＆＃34;＃＆＃34; s

if ($("#mydiv").length > 0){

如果目标div存在并且长度大于0，我可以使导航链接完成。

Answer 1

如果您的目标是确保在向任一方向滚动时，在最底层的元素上显示用户已将窗口顶部滚动到的 }类，然后：Live Example

ur-here

jquery addClass / removeClass基于div位置的导航链接

1 个答案: