-1

我正在尝试创建一个框，通过单击向上或向下箭头来向上和向下滚动项目列表，但是我单击向上或向下箭头的次数越多，速度也不是很快，它只会越来越慢地降低滚动的响应速度动画 我已经阅读了一些关于它被递归调用的内容，我认为这会增加滚动效果的响应性。我希望有些人可以查看我的 jquery 并给我一些提高性能的提示。

 $(window).load(function () {
        $("#ScrollUp_Wrapper").mouseenter(function () {
            $("#ScrollUp_Button").fadeIn("fast", function () {
                $(this).css("filter", "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#E5E5E5')"),
                $(this).css("background", "-webkit-gradient(linear, left top, left bottom, from(#F2F2F2), to(#E5E5E5))"),
                $(this).css("background", "-moz-linear-gradient(top,  #F2F2F2 , #E5E5E5)")
                $("#ScrollUp_Button").mouseup(function () {
                    $("#AllPost_leftcol").animate({ scrollTop: $("#AllPost_leftcol").scrollTop() - 200 }, 500);
                        });
                });
            }).mouseleave(function () {$("#ScrollUp_Button").fadeOut("fast");});


        $("#ScrollDown_Wrapper").mouseenter(function () {
            $("#ScrollDown_Button").fadeIn("fast", function () {
                    $(this).css("filter", "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#E5E5E5')"),
                    $(this).css("background", "-webkit-gradient(linear, left top, left bottom, from(#F2F2F2), to(#E5E5E5))"),
                    $(this).css("background", "-moz-linear-gradient(top,  #F2F2F2 , #E5E5E5)")
                    $("#ScrollDown_Button").mouseup(function () {
                        $("#AllPost_leftcol").animate({ scrollTop: $("#AllPost_leftcol").scrollTop() + 200 }, 500);
                    });
                   });
            }).mouseleave(function () {$("#ScrollDown_Button").fadeOut("fast");
        });

        });
4

2 回答 2

0

用这个：

$("#ScrollUp_Button").off('mouseup').mouseup(function () {...}

ScrollDown 按钮也是如此。

在您的原始代码中，每次鼠标进入包装器时，您都在为各个按钮处理一个新的单击事件。

于 2012-12-05T21:00:02.713 回答
0

尝试在每个下一个动画步骤排队之前调用$.stop() ：

$("#ScrollUp_Button").stop(true, true).fadeIn("fast", function () {
...
$("#AllPost_leftcol").stop(true, true).animate({ scrollTop: $("#AllPost_leftcol").scrollTop() - 200 }, 500);
...
$("#ScrollUp_Button").stop(true, true).fadeOut("fast");
...
于 2012-12-05T21:02:25.023 回答