jQuery返回页首+ StickyFloat +淡入淡出

Question

我目前在使用jQuery Stickyfloat作为“返回顶部”按钮，其中包含大量内容。它完美的工作，但是，当用户转到页面时，链接在顶部可见。我希望它在页面加载时隐藏，当用户向下滚动（大约400px）时，它会变为可见并启动stickyfloat。当用户滚动回页面时，链接消失。

jQuery的：

$('a#back-to-top').stickyfloat({duration: 150}); 

的HTML：

<div id="content"> 
    // Content goes here 
    <a href="#top" id="back-to-top">Top</a> 
</div> 

链接绝对定位的主要内容股利。 CSS：

#content { 
    position: relative; 
} 

a#back-to-top { 
    position: absolute; 
    top:0; 
    right:0; 
} 

我该如何去做这件事？

Answer 1

你想最初通过CSS隐藏浮动元素。你可以像平常一样初始化stickyfloat。然后，您想要附加处理程序到正在滚动的元素的滚动事件（BODY，DIV ..）。

在处理程序中，您要检查元素的scrollTop。一旦达到你想要的高度，淡入浮动元素。

反之亦然隐藏它。

.floating-element 
{ 
    display:none 
} 

$('el').scroll(function(e){ 
    // check target.scrollTop... 
    // fade in target 
})