https://reimaginesa.com/wp-content/plugins/element-camp/elements/assets/js/float-cursor-animation.js

1(function ($) {
2    "use strict";
3
4    function elementcamp_float_cursor($scope, $) {
5        const floatCursorContainers = document.querySelectorAll('.tcgelements-float-cursor-container');
6        const isRTL = $('body').css('direction') === 'rtl';
7
8        floatCursorContainers.forEach(container => {
9            const floatCursor = container.querySelector('.tcgelements-float-cursor');
10            let mouseX = 0, mouseY = 0;
11            let isMoving = false;
12
13            // When mouse enters the container
14            container.addEventListener('mouseenter', () => {
15                floatCursor.style.opacity = '1';
16                floatCursor.style.transform = 'scale(1)';
17                $(container.closest('.elementor-widget-tcgelements-image')).css('z-index', '20').css('position', 'relative');
18            });
19
20            // When mouse moves within the container
21            container.addEventListener('mousemove', (e) => {
22                const rect = container.getBoundingClientRect();
23                mouseX = isRTL ? rect.right - e.clientX - 75 : e.clientX - rect.left - 75;
24                mouseY = e.clientY - rect.top - 75;
25                isMoving = true;
26            });
27
28            // Update cursor position using requestAnimationFrame for smoother performance
29            function updateCursor() {
30                if (isMoving) {
31                    floatCursor.style.left = isRTL ? 'auto' : `${mouseX}px`;
32                    floatCursor.style.right = isRTL ? `${mouseX}px` : 'auto';
33                    floatCursor.style.top = `${mouseY}px`;
34                    isMoving = false;
35                }
36                requestAnimationFrame(updateCursor);
37            }
38
39            updateCursor();  // Start the update loop
40
41            // When mouse leaves the container
42            container.addEventListener('mouseleave', () => {
43                floatCursor.style.opacity = '0';
44                floatCursor.style.transform = 'scale(0)';
45                $(container.closest('.elementor-widget-tcgelements-image')).css('z-index', '').css('position', '');
46            });
47        });
48    }
49
50    // Initialize the script on both frontend and editor
51    $(window).on('elementor/frontend/init', function () {
52        elementorFrontend.hooks.addAction('frontend/element_ready/global', elementcamp_float_cursor);
53    });
54
55})(jQuery);