2015-12-01 73 views
0

我有一个返回页首按钮,显示在我正在处理的网页上。当你向下滚动,有时点击时,它会跳到顶部,然后跳回到你在页面上的位置,然后平滑地滚动到顶部。请记住,它不会一直这样做。这只是一个滞后或毛刺问题,或者如果我的脚本中有一些错误?返回页首按钮问题(可能)?

$(function(){ 

    $(document).on('scroll', function(){ 

     if ($(window).scrollTop() > 615) { 
      $('.ion-android-arrow-dropup-circle').addClass('show'); 
     } else { 
      $('.ion-android-arrow-dropup-circle').removeClass('show'); 
     } 
    }); 

    $('.ion-android-arrow-dropup-circle').on('click', scrollToTop); 
}); 

function scrollToTop() { 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $('body'); 
    offset = element.offset(); 
    offsetTop = offset.top; 
    $('html, body').animate({scrollTop: offsetTop}, 500, 'linear'); 
}; 

已搜索40+个问题,找不到答案。只是这样说,因为如果你没有找到一个人,他们总是说:“你应该先看看问。”我总是能看到它。

回答

1

回答我的问题

去这么久,没有回答,我已经离开了,并决定不担心在那个时候这个问题。今天,我正在使用相同的jQuery脚本在不同的网站上工作,并遇到同样的问题。我决定自己尝试修复它,因为我无法在这个问题上找到帮助。

解决方案很简单!我不知道我第一次错过了它。我所做的是把上面的代码,并添加一个功能,它:

$('.ion-android-arrow-dropup-circle').click(function(event) { 
     event.preventDefault() 
    }); 

我忘记了所有关于需要删除点击它是跳跃到目的地的链接的默认操作。它现在工作非常顺利,看起来很棒,就像我想要开始!

我完全更新,供大家参考脚本:

$(function(){ 
    $(document).on('scroll', function(){ 

    if ($(window).scrollTop() > 50) { 
     $('.ion-eject').addClass('show'); 
    } else { 
     $('.ion-eject').removeClass('show'); 
    } 
}); 

    $('.ion-eject').click(function(event) { 
      event.preventDefault() 
     }); 
    $('.ion-eject').on('click', scrollToTop); 
}); 

function scrollToTop() { 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $('body'); 
    offset = element.offset(); 
    offsetTop = offset.top; 
    $('html, body').animate({scrollTop: offsetTop}, 200, 'linear'); 
};