Some really nice stuff. Be sure to give the demos a spin. Original Hover Effects with CSS3 →
Tag Archives: css3
-prefix-free
Opening Titles for Web Directions South 2011
This is rather crazy, especially if you know how it’s done: The opening titles for WDS11 were designed to test the graphical capabilities of modern web browsers. Using HTML, CSS3, WebGL and Canvas, I created a 2-screen production that required 2 laptops that were carefully synced to 2 projectors. Yes, that’s right: 2 separate browsers, …
Continue reading “Opening Titles for Web Directions South 2011”
CSS 3D transformations in Firefox Nightly
Two years after CSS 3D got introduced in Webkit Nightlies: When the first 3D transformations in CSS got support on Webkit browsers people got incredibly excited about them. Now that they have matured we also support 3D CSS in Firefox. Only in Firefox Nightlies for now (Firefox 10). CSS 3D transformations in Firefox Nightly →
Apple’s iPhone 4S CSS3 animation explained
If you go to the iPhone4S product page on the Apple site, you’ll see some sweet CSS3 animations at work. John B. Hall took the birds’ eye view and analyzed what happens. The “phone stage” (blue-bordered box) contains all 6 “slides” of the animation sequence and has a transition css property with a duration and …
Continue reading “Apple’s iPhone 4S CSS3 animation explained”
Animate.css
animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness. To use them in your project, simply add the class to the element, or call the animation yourself in your CSS file. The classes and the animations have the …
CSS3 Image Styles
CSS3 Image Styles holds a set of CSS3 style rules to set some nice effects on images: Circle, Card, Embossed, Cutout, Morphing, Glowing, etc. The tad of Javascript used to dynamically enhance all the images automagically looks awfully a lot like a piece I knocked up a while ago 😉 CSS3 Image Styles →