当窗口向下滚动时,会出现一个scrolltotop图标.事情是当窗口滚动到页面的底部时,它与我不想要的div重叠.
我想要这样做,所以scrolltotop的顶部位置可以向上移动一点,以避免与窗口一起滚动到底部时与div相撞
这是我到目前为止：https://jsfiddle.net/qn6h9qad/
jQuery的：
//Scroll to top animate in
$(window).scroll(function(){
if ($(this).scrollTop() < 300) {
$('.scrollToTop').fadeOut(1000).css({right:-70});
} else {
$('.scrollToTop').fadeIn(1000).css({right:20});
}
});
//Click event to scroll to top
$('.scrollToTop').click(function(){
$('html,body').animate({scrollTop : 0},1000);
return false;
});
解决方法
您需要为窗口上的滚动事件添加一个额外的条件：
if(($(this).scrollTop() + $(this).height()) > $('.projnav').position().top){
$('.scrollToTop').css(bottom,40);
}
else{
$('.scrollToTop').css(bottom,20);
}
要使动画流畅,只需添加：
.scrollToTop{
transition: all .5s;
}
小提琴工作：http://jsfiddle.net/qn6h9qad/5/