“滚动到顶部按钮”的一些问题

我有这个'滚动到顶部按钮'，用户向下滚动300px后弹出。到目前为止一切正常。我现在想做的是让这个按钮在特定元素上弹出。“滚动到顶部按钮”的一些问题

这里是jQuery的：

// hide #back-top first 
$("#back-top").hide(); 

// fade in #back-top 
$(function() { 
    $(window).scroll(function() { 
     if ($(this).scrollTop() > 100) { 
      $('#back-top').fadeIn(); 
     } else { 
      $('#back-top').fadeOut(); 
     } 
    }); 

    // scroll body to 0px on click 
    $('#back-top a').click(function() { 
     $('body,html').animate({ 
      scrollTop: 0 
     }, 800); 
     return false; 
    }); 
});

好吧，那我改变了这一行

if ($(this).scrollTop() > 100) {

到

if ($(this).scrollTop() > '.show-button-here') {

，但没有奏效。任何想法我做错了什么？

这里是一个小提琴：http://jsfiddle.net/v70L4buk/

来源

2015-05-18 Groen91

您需要从页面顶部获得元素的位置，然后减去你想从顶部多远该元素才能得到显示向上箭头前。在这种情况下，当我在页面中创建的链接从顶部变为300px时，我会显示箭头。或者你可以删除的数量和时元素获得视口上方的功能将在踢

if ($(this).scrollTop() > $('.show').offset().top - 300) {

的jsfiddle：https://jsfiddle.net/gvpLe06c/1/

来源

2015-05-18 19:45:56 weburway

哦，我想我的问题是不够精确。当你向下滚动到一个特定的div时，我想让按钮出现，例如我在我的小提琴'.show-button-here'中使用的那个。我不想要的是它显示基于像素高度，就像你在你的例子中做的那样。不管怎么说，还是要谢谢你！ – Groen91

没有jQuery插件（https://www.customd.com/articles/13/checking-if-an-element-is-visible-on-screen-using-jquery）或广泛的编码，这是最简单的方法。将“.show”更改为您希望的元素，然后将“300”更改为在箭头出现之前距离顶端有多远。我添加了“.show”链接仅用于测试目的。它可以是任何元素。 – weburway

现在明白了：D非常感谢！ – Groen91

“滚动到顶部按钮”的一些问题

回答

相关问题