我知道有很多解决方案可以使用jquery阻止元素在某个点之后滚动,但是我想使用普通的javascript。
基本上,这是一个元素,一旦你向下滚动到它,我希望它停止被固定在页面底部,这样它就不会在页脚下,如果这有意义的话。
这是我当前的javascript:
var fixmeTop = $('#childWidth').offset().top; //get initial position
$(window).scroll(function() {
var currentScroll = $(window).scrollTop(); // get current position
if (currentScroll >= fixmeTop - 100) { // fix once scroll to or past element
var elementAdd = document.getElementById("childWidth");
elementAdd.classList.add("afix");
} else {
var elementRemove = document.getElementById("childWidth");
elementRemove.classList.remove("afix");
}
});
修复元素的css:
.afix {
position:fixed;
z-index;9999;
top:100px;
}
我试着从页面底部获取childwidth的距离,然后添加一个css类
position:absolute;
曾经在距页面底部一定距离内滚动,但当我向下滚动到接近底部时,元素就消失了。
