1

我在滚动时遇到问题，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();
            });
        };
    });

});
4

1 回答 1

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该对象。缓存一些重复使用的变量也可以稍微优化脚本。

于 2015-04-16T12:33:04.850 回答