Question

我的网络存在问题。我在我的内容右侧添加了一个图像，并使用 位置：固定 设置了它的样式，但是当我向下滚动到我的网页页脚时，我的图像被我的按下了网页的页脚。那么当我的网页页脚附近或者这个图像叠加我的网页页脚时，我怎么能隐藏这个图像呢？谢谢你的帮助!!

Answer 1

在$(document).height()-$(window).scrollTop()小于特定值时隐藏元素

<强>演示： -

$(document).ready(function () {
    $("#scrolldown").show('slow');

    $(window).scroll(function (e) {
        e.preventDefault();
        //console.log($(document).height()+'-'+$(window).scrollTop());
        if ($(document).height()-$(window).scrollTop() < 500) {
            $("#scrolldown").hide('slow');
        }
        else {
            $("#scrolldown").show('slow');
        }
    });
});

#pagewrap{
  height:1000px;
}
#scrolldown {
    position: fixed;
    color: white;
    padding: 10px 30px;
    background: red;
    bottom: 30px;
    right: 30px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="pagewrap">
	<h1>Demo</h1>
	<h2><a href="http://webdesignerwall.com/tutorials/animated-scroll-to-top">test</a></h2>
<div id="scrolldown">
  i ll hide @ bottom
</div>

</div>

Answer 2

尝试使用：位置：相对;左：0px;右：0px;调整以适合

在靠近底部滚动时隐藏图像

2 个答案: