Question

我遇到滚动问题，if条件中的2个在延迟一段时间后一直激活。我不明白为什么。这是我遇到问题的网站：www.fitfaza.pl - 右下角的灰色锚点。

代码：

// hide #back-top first
jQuery("#back-top").hide();
jQuery("#back-top2").hide();
// fade in #back-top
jQuery(function() {
    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > 500) {
            jQuery('#back-top').fadeIn();
            jQuery('#back-top2').fadeIn();
        } else {
            jQuery('#back-top').fadeOut();
            jQuery('#back-top2').fadeOut();
        }
    });


    jQuery('#back-top a').click(function() {

        jQuery('body,html').animate({
            scrollTop: 0
        }, 800);
        return false;
    });

    $(window).scroll(function() {
        var scroll = $(window).scrollTop();
        if (scroll <= 1089) {

            jQuery('#back-top2 a').click(function() {

                jQuery('body,html').animate({
                    scrollTop: 3390
                }, 800);
                return false;
            });
            $("html, body").bind("scroll mousedown DOMMouseScroll mousewheel keyup", function() {
                $('html, body').stop();
            });
        };
        if (scroll >= 3390) {

            jQuery('#back-top2 a').click(function() {

                jQuery('body,html').animate({
                    scrollTop: 1
                }, 800);
                return false;
            });
            $("html, body").bind("scroll mousedown DOMMouseScroll mousewheel keyup", function() {
                $('html, body').stop();
            });
        };
    });

});

Answer 1

这是一个似乎有效的优化脚本 - 虽然我无法轻松测试网站上的实际响应，而无需轻松删除当前活动脚本。因此，您可能需要对其进行测试，并就其功能提供一些反馈。无论如何，尝试替换为：

http://codepen.io/anon/pen/pvMmyJ?editors=001

$(function () {

  var gate = $(window);
  var root = $('html, body');
  var backtop = $('#back-top2');
  var scroll;
  backtop.hide();

  gate.scroll(function() {

    scroll = gate.scrollTop();

    if (scroll >= 500 && !backtop.is(':visible')) backtop.fadeIn();
    if (scroll < 500 && backtop.is(':visible')) backtop.fadeOut();
  });

  backtop.click(function() {
    if (scroll < 1090) root.animate({scrollTop: 3390}, 800);
    if (scroll >= 3390) root.animate({scrollTop: 0}, 800);
  });

  root.on('scroll mousedown touchstart DOMMouseScroll mousewheel keyup', function() {
    root.stop();
  });

});

查看网站的网页来源，锚图像周围的<a>标签并不是必需的。似乎$不是保留字符，因此不需要对该对象使用jQuery。缓存一些重用的变量也可以优化脚本。

滚动上下不起作用

1 个答案: