现在,我想通过单击箭头导航使每个部分水平滚动?每个部分都有一个无限的垂直滚动。
1.导航到水平滚动的导航箭头。
<a class="arrow arrow-left" role="button"></a>
2.启动内容。
<section class="timeline" id="1">infinite content..</section>
<section class="timeline" id="2">infinite content..</section>
<section class="timeline" id="3">infinite content..</section>
<section class="timeline" id="4">infinite content..</section>
<a class="arrow arrow-right" role="button"></a>
.timeline{
position: relative;
margin: 30px auto;
width: 100%;
}
.arrow {
width: 0;
height: 0;
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
position: absolute;
}
.arrow-right {
border-left: 15px solid #000;
right: 0;
}
.arrow-left {
border-right: 15px solid #000;
left: 0;
}