Wednesday, February 24, 2010

Pure HTML Clocks using Javascript & CSS Rotation

Pure HTML Clocks using Javascript & CSS Rotation:

The two Clocks are pure HTML using JavaScript and CSS rotation. There are no Adobe Flash files or <canvas> going on, just regular <div> and <img> tags. The way it works is by taking those images in an { overflow: hidden } <div> and rotating them, via JavaScript, using the proposed CSS transform property.

However, this isn’t going to work in any currently available version of Internet Explorer or many older browsers. It only works in Google Chrome, Safari and Firefox 3.5+ browsers support the CSS transform property.

css-clock

Requirements: Browsers support CSS transform property Demo: http://joncom.be/code/css-clocks/ License: License Free