CSS play - 3D Eyeball
13th March 2014
IE10+, Firefox, Chrome and Opera (Developer), but sadly not Safari
copyright © stu nicholls - CSS play
Continuing with the 3D demonstrations, this one shows how to produce a realistic looking 3D sphere without it being 3D.
The eyeball is just a flat face with radial gradient shading with the iris and pupil being circles on a 3D transform animation.
The highlights are just overlays on the eyeball.
Safari does not yet support animation on pseudo-elements.
You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.
Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.
If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.