我在一个网站上使用 Skrollr 和 Skrollr Menu 作为我的高级顶点。我将这些 div 设置为在同一位置淡入和淡出，类似于幻灯片。我的问题是，当我单击上一个和下一个链接时，它会跳回页面顶部。当我单击它们时，我希望它“向下”滚动到下一张幻灯片。我曾尝试使用 data-menu-top 但没有任何运气使用它。
<div class="slideContent" data-900="opacity:0;" data-1200="opacity:1;" data-1300="opacity:0;">
<a name="slide2"></a>
<h2>Step One</h2>
To begin, use your pencil to lightly write the word nice and big in the middle your paper. Make sure that it is written lightly because you are going to erase it later.
<br><br>
<a class="prev" href="#slide1" data-menu-top="#"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide3" data-menu-top="#"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-1300="opacity:0" data-1600="opacity:1;" data-1700="opacity:0;">
<a name="slide3"></a>
<h2>Step Two</h2>
Next, use your pencil to outline the letters.
<br><br>
<a class="prev" href="#slide2"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide4"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-1700="opacity:0;" data-2000="opacity:1;" data-2100="opacity:0;">
<a name="slide4"></a>
<h2>Step Three</h2>
Now you get to take your markers and trace the outline that you made with your pencil. Then, you take the eraser and erase the pencil lines so that all that is left is the marker outline.
<br><br>
<a class="prev" href="#slide3"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide5"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-2100="opacity:0;" data-2400="opacity:1;" data-2500="opacity:0;">
<a name="slide5"></a>
<h2>Step Four</h2>
The next couple steps are what make your letters pop out like it's 3D! Lightly draw a dotted line across your paper, a few inches under your word. Then lightly draw an "X" at the very bottom of your page. This will be your vanishing point.
<br><br>
<a class="prev" href="#slide3"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide5"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-2500="opacity:0;" data-2800="opacity:1;" data-2900="opacity:0;">
<a name="slide6"></a>
<h2>Step Five</h2>
Now, use your ruler and pencil to draw lines from all the corners on your letters to the Vanishing Point. Remember to draw these lines lightly because we will be tracing and erasing them.
<br><br>
<a class="prev" href="#slide3"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide5"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-2900="opacity:0;" data-3200="opacity:1;" data-3300="opacity:0;">
<a name="slide7"></a>
<h2>Step Six</h2>
Now we are going to erase many of the lines we just drew but it is important to know which ones to get rid of. At this point erase, only erase the lines underneath the dotted line from Step Five and lines that go through your letters.
<br><br>
<a class="prev" href="#slide3"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide5"><img src="assets/img/arrow_right.png"></a>
</div>
<div class="slideContent" data-3300="opacity:0;" data-3600="opacity:1;" data-3700="opacity:0;">
<a name="slide8"></a>
<h2>Step Seven</h2>
Not all the lines you just drew should go all the way to the dotted line. Pay attention to the direction (horizontal/vertical) of the edge of the letters
<br><br>
<a class="prev" href="#slide3"><img src="assets/img/arrow_left.png"></a>
<a class="next" href="#slide5"><img src="assets/img/arrow_right.png"></a>
</div>