悬浮div

最新推荐文章于 2024-07-25 09:25:29 发布

小妞猿

最新推荐文章于 2024-07-25 09:25:29 发布

阅读量181

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/qq_43695533/article/details/84396248

版权

html 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

obj.offsetTop 此属性返回表示当前元素上边缘距离offsetParent返回元素的距离的数值，单位是像素。
scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。
οnclick=" $(^{'} h t m l, b o d y^{'}) . a n i m a t e (s c r o l l T o p :^{'} 0 p x^{'}, 500); " o n c l i c k = "$ (‘html,body’).animate({scrollTop:$(’#bktj’).offset().top}, 400);"
节点动画返回到谁的位置 animate的时间，越少越快（单位毫秒）

scrollTop：0px  回到顶部
html、document （从头到最后）、body也算一个节点
<style type="text/css"> 
 .nav{margin: 0 auto;width: 70px;top: 80%;background: #ccc;float: right;margin-left: 90%;height: 40px;padding-top: 20px}
   .nav span{color: #666}
</style> 
<div class="nav">
        <span onclick="$('html,body').animate({scrollTop: '0px'}, 500);">回到顶部↑↑</span>
    </div>
<script type="text/javascript"> 
    var nav = document.getElementsByClassName("nav")[0]; 
var offtop = nav.offsetTop; 
window.onscroll = function () { 
var scrotop = scroll().top; 
if (scrotop < offtop) { 
nav.style.position = "fixed"; 
} else { 
nav.style.position = ""; 
}; 
}
   </script>