点击按钮滚动条下滑到相应位置

*{margin:0;padding:0;}
html,body{margin:0;padding:0;}
body{width:100%;height:2500px;}
.div1{width:100px;height:100px;top:200px;background:#fcc;position:fixed;}
    var oHeight,timer,speed;
function Go(){
timer=setInterval("goTo()",1);
}
function goTo(){
   oHeight=document.documentElement.scrollTop || document.body.scrollTop;
oHeight+=10;
if(oHeight<1500){               //应该判断在oHeight加之后是大于还是小于
window.scrollTo(0,oHeight);
}
else{
clearInterval(timer);
}
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以使用 JavaScript 来实现点击按钮后滚动到指定的位置。以下是一个示例代码: ```html <!DOCTYPE html> <html> <head> <style> #content { height: 300px; overflow-y: scroll; } </style> </head> <body> <div id="content"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <p>Phasellus blandit massa enim, at eleifend urna eleifend nec.</p> <p>Nullam euismod, ipsum sit amet commodo dapibus, nunc sem volutpat lectus, sed aliquam magna turpis sed ligula.</p> <p>Integer feugiat, quam a condimentum vestibulum, diam dui facilisis sapien, at laoreet ex diam sed tellus.</p> <p>Nunc sollicitudin vulputate neque, eu tincidunt arcu ultricies nec.</p> <p>Vivamus aliquam dapibus velit, quis ultrices nibh efficitur sit amet.</p> <p>Donec non mi orci.</p> <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p> <p>In vel felis vel magna fermentum accumsan. Donec elementum dui vitae sapien rhoncus tincidunt.</p> <p>Phasellus commodo libero eget metus hendrerit interdum.</p> </div> <button onclick="scrollToBottom()">Scroll to bottom</button> <script> function scrollToBottom() { var content = document.getElementById("content"); content.scrollTop = content.scrollHeight; } </script> </body> </html> ``` 在这个示例中,我们创建了一个带有滚动条的 `<div>` 元素,并且添加了一些示例内容。按钮的点击事件触发了 `scrollToBottom()` 函数,该函数通过将 `scrollTop` 属性设置为 `scrollHeight` 来将滚动条滚动到底部。 你可以根据需要调整代码以适应你的项目。希望这能帮到你!如果你有任何其他问题,请随时提问。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值