I added some width and height to #earth, and then gave it a background-image similar to flat earth map. Now comes the important part, the styling. Will play with :before and :after of #earth in the next section to add some detailing. But a lookalike is doable, all you need is to throw some CSS ingredients into a div and there you go.įor animation, I’ve used a small CSS keyframes trick that makes it appear lively and rotating. This idea demands a realtime rotating sphere, which is not possible in CSS. You must see the demo before we jump into the code mess. I had this one in my local playground as yet, but today I’m going to share it online right here.īefore going any further, I want to tell you that I have made it look like 3d-earth and used CSS3 keyframes for the rotating animation. I gave it a go and ended up with a kinda-cool animated planet Earth. Published on Decemby Rahul 3d Earth with Rotating Animation with CSSĪ friend of mine suggested me to do some animated planet stuff with CSS.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |