右下角悬浮框 

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             #div1{width: 200px; height: 150px;background: red;position: absolute;right: 0;bottom: 0;}
 8             body{height:2000px;}
 9         </style>
10         <script>
11             window.onscroll=window.onresize=function(){
12                 var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
13                 var oDiv=document.getElementById('div1');
14 
15                 oDiv.style.top=document.documentElement.clientHeight-oDiv.offsetHeight+scrollTop+'px';
16             }
17         </script>
18     </head>
19     <body>
20         <div id="div1">
21         </div>
22     </body>
23 </html>
右下角悬浮框

 

posted @ 2020-05-04 15:34  孝文  阅读(136)  评论(0)    收藏  举报