My latest article is up! It’s a CSS one this time 
Hi Kirupa -
Can you please make the planet rotating as well or advice on that?
Thanks.
1 Like
Hi @Gary_D_souza - it depends! How do you want the planet to rotate? If you want it to rotate horizontally or vertically, that can be done with little effort.
If you want the rotation to look more realistic where the internal design of the planet is rotating similar to how you see videos of earth from outer space, that becomes a bit trickier 
Cheers,
Kirupa
Thanks for your response @kirupa . I would say rotating at a tilted angle?
1 Like
Can you give me an example (like a YouTube video) of what a planet rotating on a tilted angle should look like? That will give me a better idea of how to apply it to what you are trying to do
1 Like
Here’s an example of the realistic version, first one only works in chrome, second both…
https://codepen.io/donovanh/pen/kQgMmE
https://codepen.io/chinchang/pen/ngOBpx
…the basic idea is create a mask of a circle and then animate its background scrolling to the right. To get the angled look to match the example here couldn’t you transform rotate the background 45 deg after the scroll (might need another div)? I couldn’t get it to work in 2 minutes so gave up. I cant think at the moment as I’m giving up smoking and going through hell with my neighbors and landlord, sorry.
2 Likes
If you want to get extreme…
https://twitter.com/anatudor/status/1664346960017367044
Makes me think if you knew trig (I sure dont) couldnt you make an svg displacement map to do the same sorta thing?
Ana Tudor is an absolute genius.
I think she might even be on the SVG working group…
1 Like
She sure is, she also a really nice person. She and a bit from Sara Soueidan helped me get my head around the 3d css stuff. Got to love those smart people that get hyper focused on one thing and share all they know with others, giving their time for personal help, and reporting ever error they encounter…absolute gems.
1 Like
