在悬停支持上添加暂停以支持多股票概念

Question

function tick(){
    $('.ticker').each(function(){
        $(this).find('li:first').slideUp(function () {
            $ticker = $(this).closest('.ticker');
            $(this).appendTo($ticker).slideDown();
        });
    });
}
setInterval(tick, 5000);

我在我的页面shown on JSfiddle here上缩进使用这个多股票代码概念。喜欢它很多，但缺少一些东西。悬停暂停。

所以，我希望以下列方式在此处添加“暂停悬停”功能for each代码：

• 徘徊的自动收报机将停止向上滑动，而其他人则会继续向上滑动（等等/反之亦然）。

可能？我对jquery很不好，所以我需要帮助。

THX！

Answer 1

的 jsFiddle Demo 的

您可以在.ticker上设置一个类名，以便在其中一个.ticker元素悬停在

上时显示暂停

$('.ticker').hover(function(){
 $(this).addClass('pause');//mouse enter
},function(){
 $(this).removeClass('pause');//mouse leave
});

然后在你的tick函数的.each迭代中筛选它（jQuery使用返回true作为伪造的continue）

if($(this).hasClass('pause'))return true;//continue;

Answer 2

请参阅解决方案。

http://jsfiddle.net/gpr9t/8/

var hoveredElement=null;

function tick(){
    $('.ticker').filter(function(item){   
                return !$(this).is(hoveredElement)
            }).each(function(){
        $(this).find('li:first').slideUp(function () {                       
            $ticker = $(this).closest('.ticker');

            $(this).appendTo($ticker).slideDown();
        });
    });
}
setInterval(tick, 1000);


$(function(){
    $('.ticker').hover(function(){
hoveredElement=$(this);        
    },function(){
        hoveredElement=null;
    });
});