Question

我有一个可滚动的内容架子。将鼠标悬停在左侧或右侧按钮上时，相框会滑动。这一切都很完美。

单击左侧或右侧按钮时，架子会跳过架子的宽度。也很完美。

我想要做的是让架子在跳跃后继续滚动，此时它一直停在一起，直到你重新悬停鼠标。我认为这只是在跳转完成后重新调用函数，所以我在if (hover)之后添加了.promise().done()，但我不确定其余的。

请告知。

感谢。

function shelfScroll(el, modifier){
        var sl = el.scrollLeft();
        el.animate({scrollLeft: sl + (modifier * 100)}, 450, 'linear', function(){ 
                if(hover){
                        shelfScroll(el, modifier);
                }
        });
}
var hover = false;
$('.scroll-arrow').each(function() {
        var modifier = ($(this).hasClass('scroll-arrow-right')) ? 1 : -1;
        var sib = ('.shelf-slide');
        var shelf_width = $(this).siblings(sib).width();
        $(this).hover(function() {
                hover = true;
                $(this).siblings(sib).stop();
                shelfScroll($(this).siblings(sib), modifier);
        }, function() {
                hover = false;
                $(this).siblings(sib).stop();
        }).click(function(e) {
                e.preventDefault();
                $(this).siblings(sib).stop();
                $(this).siblings(sib).animate({scrollLeft: $(this).siblings(sib).scrollLeft() + (modifier * shelf_width)}, 500);
                $(this).siblings(sib).promise().done(function() {
                        if (hover){

                        } else{

                        }
                });

        });
});

Answer 1

检查我发现的mouseover() $('.scroll-arrow').mouseover();可以处理或触发事件。将if (hover)放入{{1}}检查中，它应该有效。

编辑我在jQuery events尝试过，并注意到你必须跟踪哪些箭头悬停，但这应该让你走上正轨

如果悬停：动画完成后重新调用函数

1 个答案: