当前位置: 代码迷 >> JavaScript >> 垂直菜单的平滑滚动链接效果问题
  详细解决方案

垂直菜单的平滑滚动链接效果问题

热度:13   发布时间:2023-06-05 10:28:42.0

我正在尝试解决此模板上的问题: :

导航菜单上的突出显示效果仅适用于降低的浏览器高度,如果我将窗口大小调整为全屏 ( ) 并向下滚动到第 7 部分,导航上的链接菜单不会突出显示。 (我正在从 imac 的 27 中查看)

在javascripts中,我相信这个函数控制链接高亮: $(window).scroll(function() { var scrollDistance = $(window).scrollTop();

    // Show/hide menu on scroll
    //if (scrollDistance >= 850) {
    //      $('nav').fadeIn("fast");
    //} else {
    //      $('nav').fadeOut("fast");
    //}

    // Assign active class to nav links while scolling
    $('.page-section').each(function(i) {
            if ($(this).position().top <= scrollDistance) {
                    $('.navigation a.active').removeClass('active');
                    $('.navigation a').eq(i).addClass('active');
            }
    });
}).scroll();

有没有办法更改代码以适应所有屏幕尺寸? 我应该如何使该部分与引导程序交互?

我还是前端开发的新手,希望得到任何帮助!

修复您的 if 语句:

if ($(this).position().top - $(this).height() <= scrollDistance)
  相关解决方案