Javascript 页面主体滚动时，如何滚动元素？

我有一个固定的侧导航和一长串的跳转链接。当用户滚动主页内容时，跳转链接将突出显示，以显示用户在列表中的位置

问题是固定侧导航有溢出-y:滚动；当链接高亮显示时，这实际上不会向上或向下滚动

HTML:

jQuery：

jQuery(window).on('load scroll resize', function (){

    // Assign active class to nav links while scrolling
    var windowTop = jQuery(window).scrollTop();
    jQuery('h2').each(function (index, elem) {
        var offsetTop = jQuery(elem).offset().top;
        var outerHeight = jQuery(this).outerHeight(true);

        if( windowTop > (offsetTop - 110) && windowTop < ( offsetTop + outerHeight)) {
            var elemId = jQuery(elem).attr('id');
            jQuery('#fixed-side-nav li.active').removeClass('active');
            jQuery('#fixed-side-nav a.'+elemId).parents('li').addClass('active');
        }
    }); 
});

jQuery（窗口）.on（'load scroll resize'，函数（）{
//滚动时为导航链接分配活动类
var windowTop=jQuery（window.scrollTop（）；
jQuery（'h2'）。每个（函数（索引，元素）{
var offsetTop=jQuery（elem）.offset（）.top；
var outerHeight=jQuery（this）.outerHeight（true）；
中频（窗顶>（偏置-110）和窗顶<（偏置+外光））{
var elemId=jQuery（elem）.attr（'id'）；
jQuery（'#固定侧导航li.active'）.removeClass（'active'）；
jQuery（“#固定侧导航a.”+elemId）.parents（'li'）.addClass（'active'）；
}
}); 
});

有没有办法滚动固定侧导航以显示高亮显示的链接？我想在不使用focus（）的情况下执行此操作，因为这不利于辅助功能。

您可以使用：

jQuery（'#固定侧导航a.+elemId）。父（'li'）[0]。scrollIntoView（false）；

（注意，我们使用

[0]

从jQuery对象获取元素）

此函数还有一些动画选项，您可以在链接文档中使用、读取

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
  position: relative;
}

#fixed-side-nav{
  border:1px solid #ededed;
    padding:10px;
    width:12%;
    background-color:#fff;
    bottom:20px;
    overflow-y:scroll;
    bottom:20px;
    position:fixed;
  top:90px;
}
#content{
  float:left;
  margin-left:200px;
  background-color:white;
  width:100%;
}

#fixed-side-nav li.active {background-color:yellow}

jQuery(window).on('load scroll resize', function (){

    // Assign active class to nav links while scrolling
    var windowTop = jQuery(window).scrollTop();
    jQuery('h2').each(function (index, elem) {
        var offsetTop = jQuery(elem).offset().top;
        var outerHeight = jQuery(this).outerHeight(true);

        if( windowTop > (offsetTop - 110) && windowTop < ( offsetTop + outerHeight)) {
            var elemId = jQuery(elem).attr('id');
            jQuery('#fixed-side-nav li.active').removeClass('active');
            jQuery('#fixed-side-nav a.'+elemId).parents('li').addClass('active');
        }
    }); 
});