CSS3 spinning shape + static gradient | Sololearn: Learn to code for FREE!

+15

CSS3 spinning shape + static gradient

Is there a way I can make the gradient stay in the same respective place while an object moves using CSS. What I am looking for is more like the effect a real light source gives while an object is moving/spinning. Notice in the code below the gradient actually spins with the object. https://code.sololearn.com/W9J6JlP3JV59/#css

12/9/2018 11:50:48 PM

Dave

7 Answers

New Answer

+9

Make 2 layers overlapping with each other, the underneath with background-color static. Then build a 'hole' (transparent with shadow white extended out) on above layer to let underlying background through. Check this out. https://code.sololearn.com/Wqxl6UvyJgtb/?ref=app

+8

Great work!! You should look at mitali she has amazing examples.

+8

You should use the @ symbol with the persons name, so they can answer back, or they will not receive your messages. Also, if you go right now to the code playground, she created a cool snowman. You check her code and learn more about CSS. Dave

+5

Thanks Saul I will see if I can find Mitali. Can I just do a search for their name?

+4

Note, the @ symbol (in my experience) only pulls up the account selector if you are already following the person or they're in the current context (like, participating in the thread). For example, I can't link to @mitali that way, though there may be another way :) Here's the snowman: https://code.sololearn.com/WoiG29Ufd5FT/?ref=app

+4

Thanks Kirk

+4

Thanks Calvin perfect