Improve `quiz.js` for Optimized Animation and Consistent Timing

[smog-root]

The current implementation of quiz.js provides smooth animated circles and a popup message on form submission. However, there are some areas for improvement to enhance performance, readability, and timing consistency. Suggested Improvements

I'm expecting gssoc-ext with level and hacktoberfest-accepted labels @Sampadatiwari @sampadatiwari30

1. Update Popup Message Duration Comment for Consistency:

• The current code shows the popup message for 3 seconds, but the comment states 10 seconds. Update the comment to accurately reflect the current timeout duration (3 seconds) or adjust the timeout to 10 seconds if desired.

2. Optimize Circle Animation Logic:

• Modify the mousemove event listener to update coords.x and coords.y only if the mouse position changes. This reduces unnecessary DOM manipulation, which can improve performance when the mouse is stationary.

3. Add Event Listener Cleanup for Animation:

• Since the animation runs continuously with requestAnimationFrame, consider adding a way to stop or pause it when the mouse is idle. This would help conserve resources on less powerful devices.

4. Improve Animation Reset Mechanism for Border Animation:

• Replace the current reset technique by toggling an animation class instead of resetting borderAnimationDiv to none. This will improve code readability and may prevent issues if additional animations are added in the future.

5. Delegate Event Listener for Expandability (Optional):

• If more interactive elements are planned, consider using event delegation on a higher-level container. This will make adding future event listeners easier and keep the code manageable.

[github-actions[bot]]

👋 Thanks for opening this issue! We appreciate your contribution. Please make sure you’ve provided all the necessary details and screenshots, and don't forget to follow our Guidelines and Code of Conduct. Happy coding! 🚀