Question

当图片或元素进入视口时，我试图运行anime.js，但我似乎无法让它工作。我正在尝试使用waypoints.js

这是我到目前为止所做的，这是＆＃39;这个＆＃39;因为我觉得我有麻烦。

$('img').waypoint(function() {
        var CSStransforms = anime({
          targets: this,
          translateX: 250,
          scale: 2,
          rotate: '1turn'
          });
            }, {
                offset: '100%'
            });

Answer 1

您需要使用this.element来定位元素，以下是一个工作示例：

CodePen Demo

根据您的问题，您可以将其修改为以下内容：

jQuery(document).ready(function(){
    $('img').waypoint(function() {
        var CSStransforms = anime({
            targets: this.element,
            translateX: 250,
            scale: 2,
            rotate: '1turn'
        });
    }, {
            offset: '100%'
    });
});

Answer 2

您需要更改

targets : this至targets: this.element

元素进入视口时触发anime.js动画

2 个答案: