Question

$(document).ready(function() {
    $(window).scroll(function() {
        if ($(this).scrollTop() > 150) {
            $('.back-to-top').fadeIn(500);
        } else {
            $('.back-to-top').fadeOut(500);
        }
    });
    $('.back-to-top').click(function(event) {
        event.preventDefault();
        $('html, body').animate({scrollTop: 0}, 500);
    })
});

上面是我的回到顶部按钮的javascript代码，我希望它只在我滚动页面时显示。

然而，我发现当我刷新页面时这个按钮会在开头显示，并在滚动时再次隐藏＆lt; 150，滚动时再次显示＆gt; 150。

我该怎么做才能在开头隐藏它，只在滚动时显示＆gt; 150？

Answer 1

使用下面的代码。页面加载按钮上的隐藏按钮将根据您的条件150＆gt;

显示

$(document).ready(function() {

   $('.back-to-top').hide();

   // your code here

或使用css

.back-to-top{
   display:none;
}

Answer 2

<style>
.back-to-top{
   display:none;
}
</style>

Answer 3

在你的css中添加：

.back-to-top {opacity:0;}

如何在刷新页面时不显示返回顶部按钮？

3 个答案: