Skip to content

likhithnd/-Rotating-Balls-Loader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🔵 Rotating Balls Loader

This is a rotating animation of small circular balls arranged in a perfect circle using JavaScript, CSS, and HTML.

The balls continuously rotate around a central point, simulating a pre-loader or loading animation seen in modern apps and websites.

🛠️ Technologies Used

  • HTML
  • CSS (Positioning, Border-radius)
  • JavaScript (Math, requestAnimationFrame, Trigonometry)

✨ Features

  • Dynamic ball positioning using Math.sin() and Math.cos()
  • Smooth rotation animation using requestAnimationFrame()
  • Clean and minimal UI with center alignment

🧠 What I Learned

  • How to use angles and radians to position elements in a circle
  • How to animate using rotation and trigonometry
  • Real-world use of requestAnimationFrame() for smooth animations

📸 Preview

Screenshot 2025-07-12 211635

🔗 Live Demo

Coming Soon (GitHub Pages)

📂 How to Run

  1. Clone the repo
  2. Open index.html in your browser

About

A simple and smooth rotating balls loader animation using HTML, CSS, and JavaScript. Built with basic trigonometry and animation loop logic using requestAnimationFrame.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors