https://proranktracker.com/front/js/common/animation.js

1(($) => {
2
3    'use strict';
4
5    /*
6     * Images animation
7     *
8     * Calculate element parallax
9     * relative to window viewport center
10     */
11    let window_half_height = $(window).height() / 2;
12
13    let calcParallax = (offset, multiplier) => {
14        multiplier = parseFloat(multiplier);
15        return ((offset - $(document).scrollTop()) / window_half_height - 1) * multiplier;
16    };
17
18    $.animate = () => {
19        let parallax, animation, effect, multiplier, layer;
20
21        $('.animate').each((index, element) => {
22            multiplier = parseFloat($(element).data('multiplier'));
23
24            switch($(element).data('animation')) {
25                case 'parallax':
26                    animation = calcParallax($(element).offset().top, multiplier);
27                    $(element).find('.svg').each((index, svg) => {
28                        layer = parseFloat($(svg).data('layer'));
29                        $(svg).css('transform', 'translateY(' + animation * layer + '%)');
30                    });
31                    break;
32                case 'scale':
33                    parallax = calcParallax($(element).offset().top, multiplier);
34                    if (parallax >= 1) {
35                        animation = 1.05
36                    } else if (parallax <= -1) {
37                        animation = .95
38                    } else {
39                        animation = 1
40                    }
41                    $(element).css('transform', 'scale(' + animation + ')');
42                    break;
43                case 'translateX':
44                    animation = calcParallax($(element).offset().top, multiplier);
45                    effect = 'translateX(' + animation + 'px)';
46                    $(element).css('transform', effect);
47                    break;
48                case 'translateY':
49                    animation = calcParallax($(element).offset().top, multiplier);
50                    effect = 'translateY(' + animation + 'px)';
51                    $(element).css('transform', effect);
52                    break;
53            }
54        });
55    };
56
57    $.initAnimation = () => {
58        setInterval($.animate, 50);
59    };
60
61})(jQuery);