Question

我是Stack Overflow的新手。我正在为我的Wordpress网站使用Serlite的平滑滚动代码。锚点恰好是子菜单项。所以基本上当你在一个带锚点的页面上时，它几乎就像滚动单页面。挑战在于我必须确保锚点也可以在另一页面上运行。所以我设置锚点的方式是/ gallery /＃architecture，/ gallery /＃residences等。因此，平滑滚动代码的点击部分可以工作。但是，onScroll（事件）部分不起作用，即当我手动向下滚动页面时，它不会识别它所在的部分（锚点是id =“architecture”，id =“residences”等），以及将“活动”类添加到链接。现在，我的代码是：

function onScroll(event){
var scrollPos = $(document).scrollTop();
$('.sub-menu li a').each(function () {
    var currLink = $(this);
    var refElement = $(currLink.attr("href"));
    if (refElement.position().top <= scrollPos && refElement.position().top + refElement.height() > scrollPos) {
        $('.sub-menu li a').removeClass("active");
        currLink.addClass("active");
    }
    else{
        currLink.removeClass("active");
    }
});

我是否需要尝试“替换”代码？我迷路了。谢谢你的帮助！

Answer 1

如果您有子主题，请打开您的functions.php并添加以下代码：

add_filter('nav_menu_css_class' , 'make_class_active',10,2);

function make_class_active($classes, $item) {
    if (in_array('current-menu-item', $classes) ){
        $classes[] = 'active ';
    }
    return $classes;
}

过滤器用于更改或修改wordpress的现有功能。nav_menu_css_class是挂钩，当菜单加载时，它与css相关的东西一起工作。

我不知道平滑滚动效果，但参考会帮助你：

http://www.wpbeginner.com/wp-themes/how-to-add-a-smooth-scroll-to-top-effect-in-wordpress-using-jquery/

如何在手动平滑滚动上为Wordpress子菜单的复杂锚点添加活动类

1 个答案: