Posted in Javascript onNovember 15, 2017
实例如下所示:
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .scrolldiv{ width: 500px; height: 400px; margin: 10px auto; background: #f00; overflow-y: scroll; padding: 10px; } </style> </head> <body> <div class="scrolldiv" id="testDiv"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> </div> <script type="text/javascript"> var divscroll=document.getElementById('testDiv'); function divScroll(){ var scrollTop=divscroll.scrollTop;//页面上卷的高度 var wholeHeight=divscroll.scrollHeight;//页面底部到顶部的距离 var divHeight=divscroll.clientHeight;//页面可视区域的高度 if(scrollTop+divHeight>=wholeHeight){ alert('我到底部了'); } if(scrollTop==0){ alert('我到顶部了'); } } divscroll.onscroll=divScroll; </script> </body> </html>
以上这篇实现div内部滚动条滚动到底部和顶部的代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。
实现div内部滚动条滚动到底部和顶部的代码
- Author -
chaofei_liang声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@