Question

我可以在页面的顶部或底部滚动。但是在5秒之后，我希望我的滚动div消失。我使用属性延迟＆amp;隐藏的Jquery。一旦我的div消失，我必须刷新我的页面才能运行我的代码。

$(function () {

        var scrollTrigger = 100, // px
                backToTop = function () {
                    var scrollTop = $(window).scrollTop();
                    if (scrollTop > scrollTrigger) {

                        $("a[href='#top']").addClass('show').delay(2000).hide(500);
                        $("a[href='#bottom']").addClass('show').delay(2000).hide(500);

                    } else {
                        $("a[href='#top']").removeClass('show');
                        $("a[href='#bottom']").removeClass('show');
                    }
                };
        backToTop();

        $(window).on('scroll', function () {
            backToTop();
        });
        $("a[href='#top']").click(function() {
            $("html, body").animate({ scrollTop: 0 }, "slow");
            return false;
        });

        $("a[href='#bottom']").click(function() {
        $('html,body').animate({ scrollTop: 9999 }, 'slow');
        return false;
        });
    });

Answer 1

使用setTimeout（）函数。参考文献
https://www.w3schools.com/jsref/met_win_settimeout.asp， https://www.sitepoint.com/jquery-settimeout-function-examples/

例如

               backToTop = function () {

                    $("a[href='#top']").show(500);
                    $("a[href='#bottom']").show(500);

                setTimeout(function() {
                    $("a[href='#top']").hide(500);
                    $("a[href='#bottom']").hide(500);
                }, 5000)
            };

Answer 2

这是一个功能：

var goToTop = function(){
  window.scrollTo(0,/*y-coordinate (should be 0 if well-designed website)*/);
  setTimeout(function(){$(this).hide(500);},5000);
}

将它用作按钮上的点击事件绑定，如：

$(document).ready(
  $(my button JQ selector).click(goToTop);
);

然后，当你滚动时，你应该再次显示（500）'。

使用jQuery 5秒后滚动按钮隐藏？

2 个答案: