Javascript 平稳地直接移动到另一个div（过渡）

我正在创建一个演示网站，需要写一些过渡脚本，当你开始滚动时会激活。我有几个div，它们之间的差距很大

.div {
     padding: 20% 0% 20% 0%;
}

这使得两个部门之间的差距很大。现在我想写一些JS，它将顺利地从

移动到

“

这是我的HTML的结构

            <div class="col s12 m6">
                <div class="section">
                    <div id="bio" class="bio center col s12">
                        <h2> About us </h2>
                        <hr class="section-title" />
                        <p> 
                            Text
                        </p>
                    </div>
                </div>
            </div>
            <div class="col s16 m6">
                <div class="section">
                    <div id="projects" class="projects center">
                    <h2> Our projects </h2>
                    <hr class="section-title" />
                    <div class="project">
                        <h3> Title of project </h3>
                        <p> 
                            Some text
                        </p>
                    </div>
                    <h3> Planning to do </h3>
                        <span class="nothing"> Another text </span>
                    </div>
                </div>
            </div>
            <div class="col s16 m6">
                <div class="section">
                    <div id="contact" class="footer center">
                        <h2> Contact us </h2>
                        <hr class="section-title" />
                        <p> Some contacts </p>
                    </div>
                </div>
            </div>

关于我们


文本

我们的项目

项目名称

一些文本

计划做什么
另一个文本
联系我们

一些联系人

如何在div之间进行简单转换，您有什么建议吗？

您可以使用dom对象的函数。我创建了一个提琴示例，演示了如何实现这一点：

---

这在div之间造成了很大的差距。事实上，它没有。填充不会在元素之间创建空间，边距会。到目前为止，你看了什么？你将使用锚定标记滑动到div？我想我可能会使用onSlide函数，但我不确定这是一个好方法。看起来它不是为这种东西创建的哇，这很酷l！我可以在自由滚动时使用它吗？我的意思是不使用选择器按钮，而只使用我在页面上的实际位置。这对于一个页面导航栏来说真的很酷！喜欢这一个嗨，对于自由滚动，你应该使用另一个滚动到特定位置的功能。我相信这会有所帮助。

function scrollToElement(selector) {
    var el = document.querySelector(selector);    
    el.scrollIntoView({'behavior': 'smooth', 'block': 'start'});
}