使用javascript在鼠标上方停止动画

我有一个div，其中某些控件是在从数据库获取数据后动态添加的。 它有点像新闻细节，将被添加。我只是想让新闻自动滚动，这是我通过javascript实现的

现在，如果我想停止mouseover上的动画并继续mouseout，如何修改javascipt

这是我的html页面：

<section id="secbody" runat="server" style="position:absolute; background-color:dimgray; max-height:183px; min-height:183%;margin-top:14px;margin-left:545px;width:535px;">

      <div id="galheader" style="width:535px;" runat="server">
         <label id="Label1" style="color:White; position:absolute; font-size:20px; left:20px;  height: 26px; width: 100%;" runat="server"> Upcoming Programs</label> 
</div>

    <section id="secdetails" runat="server" style="font-family:'Palatino Linotype';color:white; min-width:500px;overflow-wrap:break-word;background-attachment:fixed;position:absolute;margin-top:25px;"></section>
    </section>    

即将播出的节目

这是我的javascript

    <script type="text/javascript">

        $(document).ready(function(){
            function marqueePlay(){
                $("#secdetails").animate(
                    {
                        top: $("#secbody").height() - $("#secdetails").height(),
                        opacity: 1
                    }, 4000, function(){
                        $("#secdetails").css("top", 1);
                        $("#secdetails").css("opacity", 1);
                        marqueePlay();
                    }
                );
            }
            marqueePlay();

});

    </script>

$（文档）.ready（函数（）{
函数markeeplay（）{
$（“#secdetails”）。设置动画(
{
顶部：$（“#secbody”）.height（）-$（“#secdetails”）.height（），
不透明度：1
}，4000，函数（）{
$（“#secdetails”）.css（“top”，1）；
$（“#secdetails”）.css（“不透明度”，1）；
马奎普雷（）；
}
);
}
马奎普雷（）；
});

我知道我们需要使用。停止功能，但不知道正确的使用方法

您可以使用

.hover（）

函数来完成任务

试试看

这个怎么样

function stopAnimation(){
    $("#secdetails").stop();
}

<div id="secdetails" onmouseout="marqueePlay()" onmouseover="stopAnimation()"></div>

函数stopAnimation（）{
$（“#secdetails”）.stop（）；
}

你试过答案吗？@RajaprabhuAravindasamy。。我还有一个问题。。你能帮帮我吗你看。。我有两个部分。。secbody和secdetails。。在secbody中有一个标题，然后是secdetails。。secdetails将包含所有的新闻。。现在，当我给这个动画，它将在secbody的顶部滚动，并将出来。。如果我想在secdetails滚动到顶部时，secdetails的内容在secdetails中消失，我可以做什么。如果我正确理解了您的问题，那么您必须将secdetails包装到另一个容器中。您必须将其父css设置为overflow:hidden。@RajaprabhuAravindasamy。。没错，先生。。这就是我需要的。。再次非常感谢……）谢谢你的快速回复。。。但是答案似乎是正确的，但我不知道它是否起作用。。无论如何。。谢谢你的努力……）

function stopAnimation(){
    $("#secdetails").stop();
}

<div id="secdetails" onmouseout="marqueePlay()" onmouseover="stopAnimation()"></div>