div 向下滑动 代码示例

1、要实现div向下滑动的效果，可以使用JavaScript中的scrollIntoView()方法。该方法可以将指定的元素滚动到浏览器窗口的可视区域内，从而实现滑动效果。

示例代码如下：

<div id="myDiv">这是一个需要滑动的div</div>
<button onclick="scrollDown()">向下滑动</button>
<script>
function scrollDown() {
  var myDiv = document.getElementById("myDiv");
  myDiv.scrollIntoView({ behavior: 'smooth', block: 'end', inline: 'nearest' });
}
</script>

在上述代码中，首先我们创建了一个包含需要滑动的内容的div，并给它设置了一个id，以便在JavaScript中能够获取到该元素。然后创建了一个按钮，当按钮被点击时，会调用scrollDown()函数。

在scrollDown()函数中，我们使用getElementById()方法获取到了需要滑动的div元素，并将其存储在myDiv变量中。然后调用scrollIntoView()方法，传入一个配置对象作为参数。这个配置对象中，我们设置了behavior为'smooth'，表示滑动效果会平滑进行；block为'end'，表示滑动到div的底部；inline为'nearest'，表示滑动到div的水平居中位置。

当按钮被点击时，scrollDown()函数会被调用，从而实现了div向下滑动的效果。