如何在jQuery中的某个滚动位置或元素可见时动画css 'top‘？
如何在jQuery中的某个滚动位置或元素可见时动画css 'top‘？
提问于 2015-04-24 02:56:51
当窗口向下滚动时，我有一个滚动顶部图标。问题是，当窗口被滚动到页面底部时，它会重叠一个我不想要的div。
我希望这样，滚动顶部的顶部就会向上移动，以免在窗口一直滚动到底部时与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;
});回答 2
Stack Overflow用户
回答已采纳
发布于 2015-04-24 03:51:36
您需要向窗口上的滚动事件添加一个额外的条件：
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/
Stack Overflow用户
发布于 2015-04-24 03:51:11
试一试
//Scroll to top animate in
$(window).scroll(function(){
if ($(this).scrollTop() < 300) {
$('.scrollToTop').stop(true, true).fadeOut(1000)
.css({right:-70, bottom:"20px"});
} else {
$('.scrollToTop').fadeIn(1000)
.css({right:20, bottom:"40px"});
}
});
//Click event to scroll to top
$('.scrollToTop').click(function(){
$('html, body').animate({scrollTop : 0},1000);
return false;
});jsfiddle https://jsfiddle.net/qn6h9qad/4/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29837960
复制相关文章
相似问题
腾讯云开发者
