Crazy Mouse - xbdev.net 2000 - 2026 (c) - Tutorials - Demos - Software, Game Development, Engineering, Data Mining, File Formats,Programming, Machine Learning

<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Moving Mouse Cursors</title>
    <style>
        .cursor {
            position: absolute;
            width: 15px; /* Size to match the system cursor size */
            height: 21px;
            background-image: url('https://www.freeiconspng.com/thumbs/cursor-png/download-big-image-png-medium-image-png-small-image-png-microsoft--15.png');
            background-size: 100% 100%;
            pointer-events: none;
            border: 0px solid blue;
        }
        body { overflow: hidden; }
    </style>
</head>
<body>
    <div id="cursors"></div>
    <script>
        const cursorCount = 90; // Number of cursors
        const cursors = [];
        const cursorContainer = document.getElementById('cursors');

        // Function to move a cursor smoothly
        function moveCursor(cursor) {
            const randomX = -window.innerWidth/2  + Math.random() * window.innerWidth*2;
            const randomY = -window.innerHeight/2 + Math.random() * window.innerHeight*2;
            cursor.style.transition = `transform ${Math.random() * 3 + 2}s ease-in-out`;
            cursor.style.transform = `translate(${randomX}px, ${randomY}px)`;
        }

        // Create and animate multiple cursor elements
        for (let i = 0; i < cursorCount; i++) {
            const cursor = document.createElement('div');
            cursor.classList.add('cursor');
            cursor.style.top = `${Math.random() * window.innerHeight/2}px`;
            cursor.style.left = `${Math.random() * window.innerWidth/2}px`;
            cursorContainer.appendChild(cursor);
            cursors.push(cursor);

            // Move cursor initially
            moveCursor(cursor);

            // Move cursor periodically
            setInterval(() => {
                moveCursor(cursor);
            }, Math.random() * 5000 + 300); // Move every 3-8 seconds
        }
    </script>
</body>
</html>