点击按钮,我希望它滚动到所需的位置。但是我不能锻炼,为什么它不工作。
function scrollWin() {
window.scrollTo(0, 890)
behavior: "smooth"
}
<div class="tp-caption sfb slider tp-resizeme slider"
style="z-index: 6"
data-x="center"
data-hoffset="0"
data-y="400"
data-speed="800"
data-start="1000"
data-easing="Power4.easeOut"
data-endspeed="300" data-endeasing="Power1.easeIn"
data-captionhidden="off">
<button class="btn btn-info btn-lg btn-large m-r-10"
onclick="scrollWin()">
Check out, what we're about…
</button>
</div>
window.scrollTo()
默认不顺利滚动。你必须做一些像this example provided in JSFiddle。
该理论是创建一个循环酷似系统反复调用一个方法来再现平滑滚动的图示。
请注意,这只是一个很简单的(甚至是愚蠢的)示例代码来演示如何做这样的工作,你不应该在生产模式使用此。
如果您需要更复杂的系统,更多的配置或随着时间的推移,速度和动画的类型更多的控制,你应该使用类似Scrull或任何平滑滚动库在那里。