Bodymovin JS 的鼠标悬停事件答案

【问题标题】：Mouseover event with Bodymovin JSBodymovin JS 的鼠标悬停事件
【发布时间】：2016-04-26 15:38:11
【问题描述】：

我希望将鼠标悬停事件添加到从 After Effects 导出的 SVG 中。我希望 SVG 在 mouseover 上播放。到目前为止，我已经使用了 animation-play-state 属性，但它没有奏效。我也尝试在脚本中使用onmouseover 并尝试为mouseover 添加事件侦听器，但仍然没有。我做错了什么？

var params = {
    container: document.getElementById('bodymovin'),
    renderer: 'svg',
    loop: true,
    autoplay: true,
    animationData: animationData

};

var anim;

anim = bodymovin.loadAnimation(params);

【问题讨论】：

标签： javascript svg hover onmouseover bodymovin

【解决方案1】：

我这样做，它对我有用：

animContainer = document.getElementById('bodymovin');

var params = {
    container: animContainer,
    renderer: 'svg',
    loop: true,
    autoplay: true,
    autoplay:false,
    autoloadSegments: false,
    path: 'data.json'// path to your data.json file you rendered from AE

};

var anim;

anim = bodymovin.loadAnimation(params);
animContainer.addEventListener("mouseover", myScript);

function myScript(){
    anim.play();
}

【讨论】：