使用 jQuery 自动向下滚动动画
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12328050/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
auto animated scroll down using jQuery
提问by user1656139
I am trying to make an animated scroll to a bottom button using jQuery that fades out when the page is located at the bottom. I have found this code on the internet and modified it, but I could not get it work.
我正在尝试使用 jQuery 将动画滚动到底部按钮，当页面位于底部时该按钮会淡出。我在互联网上找到了这段代码并修改了它，但我无法让它工作。
<script>
//to bottom
$(document).ready(function(){
// hide #back-top first
$("#back-bottom").show();
// fade in #back-top
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() 1) {
$('#back-bottom').hide();
} else {
$('#back-bottom').show();
}
});
// scroll body to 0px on click
$('#back-bottom a').click(function () {
$('body,html').animate({ scrollTop: 0 }, 800);
return false;
});
});
});
</script>
回答by Harsh Baid
I think you need to calculate body height and pass that to the scrollTop parameter in the animate
我认为您需要计算身体高度并将其传递给动画中的 scrollTop 参数
$('body,html').animate({ scrollTop: $('body').height() }, 800);
[Check here the working demo]// Link has stopped working
[在这里查看工作演示]// 链接已停止工作
回答by Anudeep GI
$('#back-bottom a').click(function () {
$('body,html').animate({ scrollTop: $('body').height() }, 500);
return false;
});
i think it will work for you
我认为它对你有用
回答by Michael Peterson
Created an example fiddle that works:
创建了一个有效的示例小提琴：
Changed the condition to hide the button to: if($(window).scrollTop() + $(window).height() == $(document).height())
将隐藏按钮的条件更改为： if($(window).scrollTop() + $(window).height() == $(document).height())
To scroll back to the top, added a variable that gets the height of the body:
var $elem = $('body')Then when the link is clicked, changed the value to be:
scrollTop: $elem.height()
要滚动回顶部，添加了一个获取主体高度的变量：
var $elem = $('body')然后当点击链接时，将值更改为：
scrollTop: $elem.height()
