打开并滚动到手风琴部分

Question

我有一个单页网站，内容放在手风琴里面。当用户点击页面顶部的导航栏时，我需要打开并滚动到手风琴项目。我找到了几个类似的函数，这是最接近的（Open JQuery accordion when link with an id of element within the accordion is clicked）但不幸的是jsfiddle链接不再起作用。

现在我只是让代码让手风琴工作......需要让滚动器以某种方式参与其中......谢谢！

代码

var accordion_head = $('.accordion > li > .toggle-bar');

accordion_head.on('click', function (event) {
    var $a = $(this);
    event.preventDefault();
    
    if ($a.hasClass('active')) {
        $a.removeClass('active').siblings('.content-wrapper').slideUp();
    }
    else {
        $a.addClass('active').siblings('.content-wrapper').slideDown();
    }
});

.accordion li .content-wrapper {
    display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<ul class="accordion">
		<li id="1">
			<a class="toggle-bar" href="#one"><h2>Headline</h2></a>
			

			<div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
        <li id="2">
			<a class="toggle-bar" href="#two"><h2>Headline</h2></a>
			

			<div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
        <li id="3">
			<a class="toggle-bar" href="#three"><h2>Headline</h2></a>
			

			<div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
</ul>