Javascript 鼠标悬停时播放动画，鼠标悬停时停止动画

我是新手。我得到了一个运行良好的代码，但如何在JavaScript（jQuery）中使其在鼠标悬停时可播放，在鼠标悬停时可停止。我还想知道，当我们再次鼠标悬停在动画上时，从一开始就开始。我添加了几行，例如：

$('document').ready(function()
$('#bodymovin').hover(function()

要产生悬停效果，但当鼠标悬停时，动画仍在播放，并且在开始时鼠标悬停之前，动画不会显示我的

（这不好：（））。 如果你能在一行代码附近写评论就太好了。谢谢

<script>

$('document').ready(function() {

    $('#bodymovin').hover(function() {

        var anim;
        var animData = {
            container: document.getElementById('bodymovin'),
            renderer: 'svg',
            loop: false,
            autoplay: true,
            rendererSettings: {
            progressiveLoad:false
            },
            path: 'data.json'
        };

        anim = bodymovin.loadAnimation(animData);

    });
});

</script>

$（'document'）.ready（函数（）{
$（'#bodymovin'）。悬停（函数（）{
var anim；
变量数据={
容器：document.getElementById（'bodymovin'），
渲染器：“svg”，
循环：false，
自动播放：对，
渲染器设置：{
progressiveLoad:false
},
路径：“data.json”
};
anim=bodymovin.loadAnimation（animData）；
});
});

你想要哪种类型的动画？这可能是你可以通过CSS实现的？我已经知道了如何制作，但现在我正在尝试如何在之后进行反向播放。停下来。也许你有什么想法？我为什么要这样做？嗯，我不喜欢鼠标删除后动画如何中断。我想让它变得平滑和易于使用-友好。这是我的代码：

animContainer.addEventListener（“mouseenter”，myScript1）；animContainer.addEventListener（“mouseleave”，myScript2）；函数myScript1（）{anim.play（）；}函数myScript2（）{anim.stop（）；}

只要把代码放在'anim=bodymovin.loadAnimation（animData）'后面就行了