要实现让一个按钮滚动多个div,可以通过以下步骤来完成:
<div id="container">
<div class="content">内容1</div>
<div class="content">内容2</div>
<div class="content">内容3</div>
<div class="content">内容4</div>
</div>
#container {
width: 300px;
height: 200px;
overflow: hidden;
}
.content {
width: 300px;
height: 200px;
}
var container = document.getElementById("container");
var button = document.getElementById("button");
button.addEventListener("click", function() {
container.scrollTop += 200; // 每次滚动200像素
});
在上述代码中,通过获取容器和按钮的DOM元素,并为按钮添加点击事件监听器。当按钮被点击时,通过改变容器的scrollTop属性来实现滚动效果。每次点击按钮,容器向下滚动200像素。
这样,当点击按钮时,容器中的内容div将会滚动,展示下一个div的内容。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云对象存储(COS)。
云+社区沙龙online [技术应变力]
云+社区沙龙online [国产数据库]
云+社区技术沙龙[第14期]
新知
GAME-TECH
Elastic 中国开发者大会
停课不停学 腾讯教育在行动第三课
云+社区开发者大会(杭州站)
技术创作101训练营
领取专属 10元无门槛券
手把手带您无忧上云