js滚动到顶部后浮空顶部
第一种方法:
<script type="text/javascript">
function menuFixed(id) {
var obj = document.getElementById(id);
var _getHeight = obj.offsetTop;
window.onscroll = function () {
changePos(id, _getHeight);
}
}
function changePos(id, height) {
var obj = document.getElementById(id);
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop < height) {
obj.style.position = 'relative';
} else {
obj.style.position = 'fixed';
obj.style.top = '5px';/*这里是你浮空后跟顶部的距离*/
}
}
window.onload = function () {
menuFixed('home_ss_r');/*这里是你浮空的id名称*/
}
</script>
第二种方法:
<style>.fiexd_top0 .home_ss_r{/*这里是你浮空的class名称*/position:fiexd;top:0;/*这里是你浮空后跟顶部的距离*/}</style>
<script>
var header = document.getElementsByClassName('home_ss_r')[0];/*这里是你浮空的class名称*/
var body = document.body;
window.onscroll = function() {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
console.log(scrollTop);
if (scrollTop > 400) {/*控制滚动多少像素*/
obj.style.position = 'relative';
} else {
body.className = '';
}
}
</script>
控制滚动多少像素后浮空到顶部