显示“返回页首"向下滚动时使用jQuery的链接元素 [英] Show "Back to top" link element using jQuery when you scroll down

问题描述

我想用jQuery模仿行为，就像您在这里看到的那样: http://edo.webmaster.am/

I want to mimic behaviour with jQuery like you can see here: http://edo.webmaster.am/

只需查看右下角，向下滚动一点，您将看到返回顶部"按钮.

Just look at the right bottom corner, scroll down a bit and you'll see the "back to top" button.

因此它是不可见的，直到您向下滚动页面，然后该页面出现(动画).

So it's invisible until you scroll down a page and then it appears (animated).

如何在jQuery中做到这一点?

How can I do that in jQuery ?

推荐答案

您可以监视当前窗口的滚动位置并采取相应的措施.如果您希望偏移量在某个点之后(下面的代码将进行任何滚动，甚至滚动1px)，则只需在if语句中检查$(this).scrollTop() > n，其中n是所需的偏移量即可.

You can monitor the current window scroll position and act accordingly. If you want the offset to be after a certain point (the below code will do any scrolling, even 1px) then just check that $(this).scrollTop() > n in the if statement, where n is the desired offset.

http://jsfiddle.net/robert/fjXSq/

$(window).scroll(function() {
    if ($(this).scrollTop()) {
        $('#toTop:hidden').stop(true, true).fadeIn();
    } else {
        $('#toTop').stop(true, true).fadeOut();
    }
});

这篇关于显示“返回页首"向下滚动时使用jQuery的链接元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！