div盒子position:fixed定位后无法滚动到页面顶部了

2019独角兽企业重金招聘Python工程师标准>>>

• 今天在做div盒子固定定位的时候，遇到了一个坑，小编记录一下，如果同样的问题，你也可以试试。。
• 页面的header部分使用了position:fixed固定定位，没问题~~~完全ok
• 在页面滚动到某个地方的时候（window.onscroll方法），固定某个div盒子。但是如果这个盒子是由内容撑开的，而下面的内容在比较多的时候还会出现另外的滚动条，，，，该怎么办？
• 结果： 在window.onscroll中，判断该页面滚出的距离(scrollTop),当滚动到某个高度时，给该div盒子加position:fixed,top:0。但是如果此时，你要再想将页面滚动到最上面，则不可能了。。
• 分析：找了好久都不行，最后请教了一下之前认识的大牛，问题就是因为该盒子设置固定定位以后，整个页面的高度就变了，所以你再滚动的时候，页面高度已经改变了，那么就回不到最上边了。那么以前的为什么可以呢？是因为之前固定定位的元素都是直接放在body下面的，而固定定位下面的内容也是直接放到body中（直接子盒子，我这么称呼）。但现在内容必须和固定定位元素一起，所以出现了问题。。真的很坑。。。。。。
• 解决：很感谢那位大牛，在分析了clone+append+hide/show、重新写抽出需要定位的元素等各种方法后，又想到了一个很不错的方法，就是在页面滚动到某个位置时，将需要固定定位的div盒子的高度设置为body的高度，这样，页面就无法再滚动了。具体设置为：在页面加载的时候，获取到body的高度，将该div盒子的高度设置为body的高度。这样，当页面滚动到最顶部的时候，该div盒子就已经是最大高度了，无法再滚动了。
• 注意一个小问题，需要设置为body高度是div盒子，但是具体要看该div盒子是由页面中哪个部分的元素撑开的，要设置它的高度才可以。
• 如果各位路过的大神有什么更好的建议，希望直接发代码，多谢。。。。小编多谢啦，辛苦。。。。

转载于:https://my.oschina.net/yxmBetter/blog/919990