Question

这是我的代码：

$(document).ready(function() {
    function ticker() {
        $('#ticker li:first').slideUp(function() {
            $(this).appendTo($('#ticker')).slideDown();
        });
    }

    setInterval(function(){ ticker(); }, 3000);
});

当我将鼠标放在特定标题上时，我不知道如何停止文字滚动。SEE HERE MY CODE

Answer 1

请尝试这个：

$(document).ready(function () {
    function ticker() {
        $('#ticker li:first').slideUp(function () {
            $(this).appendTo($('#ticker')).slideDown();
        });
    }

    var clr = null;
    function animate(){
        clr=setInterval(function () {
            ticker();
        }, 3000);
    }
    animate();
    $('#ticker li').hover(function () {
        // clear interval when mouse enters
        clearInterval(clr);
    },function(){
        // again start animation when mouse leaves
        animate();
    });
});

DEMO

Answer 2

您可以添加一个新变量，该变量将保存输入鼠标的值

查看更新后的代码

$(document).ready(function() {
  var entered = false;
  $('#ticker').mouseover(function(){
        entered = true;
    })
  $('#ticker').mouseout(function(){
        entered = false;
    })
       function ticker() {
           if(!entered){
$('#ticker li:first').slideUp(function() {
    $(this).appendTo($('#ticker')).slideDown();
});
           }
}

setInterval(function(){ ticker(); }, 3000);
    });

Answer 3

    $(document).ready(function() {
  var j= setInterval(function(){ ticker(); }, 3000);

      var i=1;
 function ticker() { 
    $('#ticker li:first').slideUp(function() {
        $(this).appendTo($('#ticker')).slideDown();
        i++;
        if(i==4){
            alert("ok");
            clearInterval(j) ;
        }
    });


}
        });

您可以使用clearInterval（）函数设置i的限制并停止脚本。

如何使用jQuery停止文本滚动

3 个答案: