如何让我的手风琴面板在打开时自动向下滚动？

Question

当我打开手风琴时，我希望面板展开，然后一旦展开，我想要html页面自动滚动到面板。例如，如果我点击隐藏展开时的面板，我该如何制作，以便我的网页自动向下滚动到面板？

HTML代码：

<button class="accordion">Images</button>
    <div class="panel">
        </div>
    </div>
<button class="accordion">Images</button>
    <div class="panel">
        </div>
    </div>

JavaScript的：

<script>
        var acc = document.getElementsByClassName("accordion");
        var i;

        for (i = 0; i < acc.length; i++) {
            acc[i].onclick = function(){
                this.classList.toggle("active");
                this.nextElementSibling.classList.toggle("show");
            }
        }
    </script>

Answer 1

如果你正在使用jQuery，你可以尝试这样的事情：

$(".accordion").on("click", function(){
  $("html, body").animate({ scrollTop: $(this).offset().top }, 'fast');
  return true;
});

当点击手风琴按钮时，这将使网页滚动到元素。