将jquery-script与waypoints JS连接起来

Connect jquery-script with waypoints JS

本文关键字：连接 起来 JS waypoints jquery-script      更新时间：2023-09-26

我已经在我的网站上包含了waypoints.js脚本。现在我想把这个脚本和一些jquery连接起来。如果内容在视口中，脚本应该"启动"。

在另一个站点我使用

$('.fly-in-animation').waypoint(function() {
              $(this.element).addClass('animated fadeInUp');
          }, { offset: '100%' });

但是我不知道如何连接的路径点脚本与这些jquery:

$({countNum: $('#counter-laender').text()}).animate({countNum: 14}, {
  duration: 2000,
  easing:'linear',
  step: function() {
    $('#counter-laender').text(Math.floor(this.countNum));
  },
  complete: function() {
    $('#counter-laender').text(this.countNum);
  }
});

使用来自Waypoints站点的示例代码结合您提供的内容(假设您希望在#counter-laender进入视口时发生这种情况):

$(document).ready(function() {
  $('#counter-laender').waypoint(function() {
    myFunction();
  });
});
function myFunction() {
    $({
        countNum: $('#counter-laender').text()
    }).animate({
        countNum: 14
    }, {
        duration: 2000,
        easing: 'linear',
        step: function () {
            $('#counter-laender').text(Math.floor(this.countNum));
        },
        complete: function () {
            $('#counter-laender').text(this.countNum);
        }
    });
}
相关文章：