Animated 3D Chessboard With Pure CSS3. No Images. No JavaScript

I enjoyed coding this one last night. The word is about animated 3D chessboard, achieved with pure CSS, no images and no JavaScript, making use of nth-child selectors, 3d transforms, keyframe animations, generated content and the UTF symbols of the chess figures:

animated-css3-only-chessboard-blog

Supported Browsers:

  • Firefox
  • Chrome
  • Opera Webkit
  • Opera
  • Safari
  • Internet Explorer 9+ (with nice fallback for the 3D stuff)

Not really much of a practical value, I must admit, but showcasing the immense power of CSS3 which can be used today. Have fun and enjoy the weekend!

Related Posts and Links

 

4 comments

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s