javascript - 淡入后转到顶部按钮在 Chrome 中不可见

Question

我遇到了一个非常奇怪的问题。

当我使用 page down 或 fragmented identifier 跳转到某个 div 时，我的 go to top image 是不可见的。

这是我的代码。

html:

<a title="Go to top" href="#" class="back-to-top"></a>

少(CSS):

.back-to-top {
position: fixed;
bottom: 50%;
right: 15px;
text-decoration: none; 
overflow: hidden;
font-size: 12px;
padding: 1em;
display: none;
background-image: url("/images/go-top.png");
width: 48px;
height: 48px;

JavaScript:

    $(window).scroll(function() {
    if ($(this).scrollTop() > offset) {
        $('.back-to-top').fadeIn(600);
    } 
    else {
        $('.back-to-top').fadeOut(600);
    }
});

$('.back-to-top').click(function(event) {
    $('html, body').animate({scrollTop: 0}, duration);
    return false;
});

Answer 1

DEMO

$(文档).ready(函数(){

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

    $(function () {
        $(window).scroll(function () {
            if ($(this).scrollTop() > 200) {
                $('.back-to-top').fadeIn();
            } else {
                $('.back-to-top').fadeOut();
            }
        });
    });
});

DEMO 2

$(document).ready(function () {
    $('.back-to-top').hide();
    var test = 1;
    $(function () {
        $(window).scroll(function () {
            if (test == 1) {
                if ($(this).scrollTop() > 200) {
                    $('.back-to-top').fadeIn();
                }
                test = 2;
            } else if (test == 2) {
                if ($(this).scrollTop() < 200) {
                    $('.back-to-top').fadeOut();
                }
                test = 1;
            }
        });
    });
});