Clever, but light comes from the sky (it always comes from the sky in nature...light from below weirds us out). It's probably poor design to have shadows rotating throughout the day. Might be more friendly to have the shadows play like real shadows (never going above the object).<p>Source: <a href="http://static.tvtropes.org/pmwiki/pub/images/TV_Tropes_Flashlight_Image_5440.jpg" rel="nofollow">http://static.tvtropes.org/pmwiki/pub/images/TV_Tropes_Flash...</a>
Neat idea, but shadows cast on the ground don't move around an object a full 360deg over the course of the day.<p>If the metaphor is that we're looking at the object from above, then the angle of the shadow would depend on the time of day, the day of the year, and the object's latitude. Now THAT would be a neat plugin.<p>Others have mentioned that Google does it like this in Google Maps...which is even stranger because there is a very clear real world analog in that case. I would have expected that they would take the care to render the shadows as they would actually appear for that location at that time.
This feels unnecessary, although it's some cool code for sure. I think it ends up looking unnatural when the generated shadow doesn't match the shadow in the icon itself; in the demo on the github page, this would be at 1 o'clock and 5 o'clock.
Google maps does this for shadows on buildings - check out something tall to see. It makes more sense there as the shadows actually fall in that location. As an interface it's a cool idea but we normally consider light to fall from top to bottom.
Cool demo and js file size. I did something similar a while back and thought I would share <a href="http://codepen.io/social_quotient/pen/msrIx" rel="nofollow">http://codepen.io/social_quotient/pen/msrIx</a>
This would be cool on a mobile, since you usually hold it with the display facing towards the sky. But then, the length and angle of the shadow have to depend on the orientation of the phone.
Nerd Snipe! - Pick a website that uses consistent shadows. Assume that the website is a 3 dimensional object that could cast those shadows. Also assume that the object is positioned sitting on the ground, with the length of the page normal to the surface of the earth. Provide a location, rotation, time of day and day of year in which the shadows are accurate.
The effect gets totally ruined on the demo page where the HTML5 and CSS3 shields are used which have their own light source. Screenshot: <a href="http://i.imgur.com/prMIIOQ.png" rel="nofollow">http://i.imgur.com/prMIIOQ.png</a>
Wouldn't using svg's be tremendously more powerful, rather than pngs and image sprites? Of course, there are compatibility issues with older browsers but placing 1 of 4 pngs is just barely "time aware"
To be honest, this library doesn't really make sense.<p>Perhaps a related but more useful idea would be to adjust the colors of your site to match the user's local time like f.lux...