Orbit the Sun with HTML and CSS. The model is kind of accurate—not really; however, it was fun to make. I learned how SVG offset paths work in the process of making this. Don't bother waiting around to watch Neptune complete a single orbit; that will take approximately 27 minutes.
10 seconds for every 365.26 days
Planet | Revolution period | CSS Revolution period |
---|---|---|
Mercury | 87.97 days | (87.97 / 365.26) * 10s |
Venus | 224.7 days | (224.7 / 365.26) * 10s |
Earth | 365.26 days | (365.26 / 365.26) * 10s |
Mars | 1.88 years | 1.88 * 10s |
Jupiter | 11.86 years | 11.86 * 10s |
Saturn | 29.46 years | 29.46 * 10s |
Uranus | 84.01 years | 84.01 * 10s |
Neptune | 164.79 years | 164.79 * 10s |
Source for revolution period data https://www.exploratorium.edu/explore/solar-system/age