转载自寂寞的天下着忧郁的雨 博客 html 代码 <!DOCTYPE <span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>><br /> <<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>><br /> <head><br /> <meta charset="utf-8"><br /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><br /> <title><span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/javascript" title="js" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">js</a></span>滚动条回到底部</title><br /> <meta name="description" content=""><br /> <meta name="keywords" content=""><br /> <link href="" rel="stylesheet"><br /> <style type="text/<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>"><br /> body{<br /> padding:0;<br /> margin:0;<br /> }<br /> .box{<br /> position:relative;<br /> height:500px;<br /> width:100%;<br /> overflow-y:scroll;<br /> }<br /> .box1{<br /> height:1000px;<br /> width:100%;<br /> background:red;<br /> }<br /> .box2{<br /> height:1000px;<br /> width:100%;<br /> background:green;<br /> }<br /> .box3{<br /> height:1000px;<br /> width:100%;<br /> background:gray;<br /> }<br /> .box4{<br /> height:1000px;<br /> width:100%;<br /> background:yellow;<br /> }<br /> .box5{<br /> height:1000px;<br /> width:100%;<br /> background:blue;<br /> }<br /> .box6{<br /> height:2000px;<br /> width:100%;<br /> background:#eaeaea;<br /> }<br /> .scroll{<br /> height:30px;<br /> width:30px;<br /> background:#4CC9C8;<br /> position:fixed;<br /> right:40px;<br /> top:450px;<br /> display:block;<br /> }<br /> </style><br /> </head><br /> <body><br /> <div class="box" id=’box’><br /> <div class="box1"></div><br /> <div class="box2"></div><br /> <div class="box3"></div><br /> <div class="box4"></div><br /> <div class="box5"></div><br /> <div class="scroll" id=’scroll’></div><br /> </div><br /> <script type="text/javascript"><br /> window.onload=function(){<br /> var oScroll=document.getElementById(‘scroll’),<br /> box=document.getElementById(‘box’),<br /> time=null,<br /> spped=0,<br /> boxH=box.scrollHeight,<br /> scrollT=box.scrollTop;<br /> console.log(boxH,scrollT)<br /> function scroll(boxH,scrollT){<br /> speed=20;<br /> clearInterval(time)<br /> time=setInterval(function(){<br /> if(scrollT<boxH){<br /> scrollT+=speed;<br /> box.scrollTop=scrollT;<br /> }else{<br /> clearInterval(time)<br /> }<br /> },10)<br /> }<br /> scroll(boxH,scrollT);<br /> oScroll.onclick=function(){<br /> boxH=box.scrollHeight;<br /> scrollT=box.scrollTop;<br /> scroll(boxH,scrollT);<br /> }<br /> }<br /> </script><br /> </body><br /> </<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>>
前端开发者
970106_lzh 2年前 (2021-01-08)说：
huihui 2年前 (2020-10-20)说：
Satisfy 3年前 (2020-06-05)说：
评论前必须登录！
注册