https://mpc-web.jp/recruit/wp-content/themes/kaishindo-recruit/assets/js/scroll-image.js

1//　スクロールを戻すと再度アニメーションをするの場合
2// (function() {
3//     const image = document.querySelectorAll('.img-wrap');
4
5//     const observer = new IntersectionObserver(function(entries) {
6//         entries.forEach(function(entry) {
7//             if (entry.intersectionRatio > 0) {
8//                 entry.target.classList.add('img-animation');
9//             } else {
10//                 entry.target.classList.remove('img-animation');
11//             }
12//         });
13//     });
14
15//     Array.prototype.forEach.call(image, function(img) {
16//         observer.observe(img);
17//     });
18// })();
19
20//アニメーションが1回だけの場合
21(function() {
22    const image = document.querySelectorAll('.img-wrap');
23
24    const observer = new IntersectionObserver(function(entries) {
25        entries.forEach(function(entry) {
26            if (entry.intersectionRatio > 0) {
27                entry.target.classList.add('img-animation');
28                observer.unobserve(entry.target);
29            }
30        });
31    });
32
33    Array.prototype.forEach.call(image, function(img) {
34        observer.observe(img);
35    });
36})();