简介:
功能简介,js 滚动条自动滚动到最底部
效果展示:
核心代码:
window.scrollTo(0, document.body.scrollHeight);
复制
代码示例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script> </head> <body> <div class="panel-body" style="flex-grow: 1; overflow-y: auto; background-color: #343541; color: white;"> </div> <div style="position: sticky; bottom: 0;"> ceshi </div> <script> setInterval(function() { $(".panel-body").append("123456<br>" + new Date()); scrollBoxFun(); }, 100) function scrollBoxFun() { window.scrollTo(0, document.body.scrollHeight); } </script> </body> </html>
复制
代码示例2:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script> </head> <body> <div class="card" style="height: 100vh;"> <div class="panel-body" style="flex-grow: 1; overflow-y: auto; background-color: #343541; color: white;"> </div> <div style="position: sticky; bottom: 0;"> ceshi </div> </div> <script> setInterval(function() { $(".panel-body").append("123456<br>" + new Date()); scrollBoxFun(); }, 100) function scrollBoxFun() { window.scrollTo(0, document.body.scrollHeight); } </script> </body> </html>
复制