我在bottom: 0
上有一个固定按钮,当点击它时会执行滚动到另一个元素,但是当它到达那个元素并且当它滚动到该元素时,我需要隐藏它。
我如何使用jQuery
?
到目前为止我已经完成了这项工作,但这还不够。
function hideScroller () {
div1 = $('#form');
div2 = $('#slide-to-contacts');
div1FromTop = div1.offset().top;
div2FromTop = $('body').scrollTop();
if (div1FromTop <= div2FromTop) div2.hide();
else div2.show();
}
答案 0 :(得分:2)
我认为大部分工作都符合预期,只是div2的选择器不正确。最好使用$(window).scrollTop()
或顺便提一下$('html, body').scrollTop()
。
更新 - 调整触发器时的调整:
http://jsfiddle.net/ydbev5rq/7/
div2FromTop = $(window).scrollTop()+$(window).height();
当然,当你永远不会伤害时使用$(this)
......
div2FromTop = $(this).scrollTop()+$(this).height();
答案 1 :(得分:0)
用你的代码解决它。只是改变了div2 id并使&gt; = to&lt;和div1.scrollTop()到offset()。顶部。
这是js代码
function hideScroller() {
div1 = $('#form');
div2 = $('#scroll-to-contacts');
div1FromTop = div1.offset().top;
div2FromTop = $('#scroll-to-contacts').offset().top;
if (div1FromTop < div2FromTop) div2.hide();
else div2.show();
}
$(document).ready(function () {
//hideScroller();
form = $('#form');
$('#scroll-to-contacts').click(function () {
$('html, body').animate({
scrollTop: form.offset().top
}, 1000);
});
});
$(window).scroll(function () {
hideScroller();
});