5 ms·
3d CSS3 HTML5 Logo
Pure CSS 3D webkit animation, only works on a mac, uses hardware accelerated css transforms and @-webkit-keyframe animations.
- alttab 16y agono firefox?
- chopsueyar 16y agoNo!
- thristian 16y ago"WebKit proprietary CSS extensions" are not "CSS3".
- olalonde 16y agoThe "proprietary extensions" follow the CSS3 working draft: http://www.w3.org/TR/css3-3d-transforms/ http://www.w3.org/TR/css3-3d-transforms/
- robin_reala 16y agoNot really, the @keyframes syntax isn’t in there yet.
- clemesha 16y agoEvery time I see CSS3/HTML5 demos like this, I think "awesome, but what's the IE situation?". I mean that in a honest way, not in a "oh, that probably will never work on IE type of way". IE9 is supposedly way better than before - will it support stuff like this?
- noibl 16y agoCSS 2D Transforms - yes. 3D - nobody knows.
- est 16y agoIE introduced expression() in CSS decades ago. Like -webkit-transform, they are both private non-standard way of doing animations. IE4/5/6 even had hardware accelerated 3D graphic and dynamic music support, dHTML was cool before HTML5 coolkids took over.
- ugh 16y agoIt’s quite disingenuous to compare CSS transform to expression().
- robin_reala 16y agoexpression() gives you a functional method for defining animations; CSS transforms are declarative. They’re a different thing entirely. Besides, expression evaluates on mousemove which is horrible for performance: http://blog.dynatrace.com/2010/02/16/the-real-performance-overhead-of-css-expressions/ http://blog.dynatrace.com/2010/02/16/the-real-performance-ov...
- est 16y agoThere are also DXImageTransform filter and VML
- blocke 16y ago"safari 5 or chrome 9 on a mac" How did you manage to make something that only works on a Mac in Chrome? Looks messed up under Windows... Bravo!
- ggordan 16y agoTry refreshing the page a few times. It worked for me (Chrome on Mac) the first time I tried it, but after clicking on it again it looks messed up. Edit: My mistake. I was testing it out on a different browser first time around. I tried a few times with Chrome 10.* and it doesn't work.
- EllieAsksWhy 16y agoI viewed it with Chrome 9 beta in Windows 7. It rotates very nicely in 3-D. But it looks like Hawaii Punch graffiti defacing an HTML5 logo. Does Hacker News support images? What is it supposed to look like? I'm curious. That's probably a stupid question, about Hacker News. I'd be satisfied with a link to a 2-D image version, thanks.
- sid0 16y ago"safari 5 or chrome 9 on a mac" Thank you for embracing the spirit of HTML5 and the Web.
- delinquentme 16y agocool code, some perspective top to bottom might give it some additional "3d pop"
- po 16y agoJeez guys, cut them some slack. It's a nice demo that happens to use a lot of features that aren't widely available yet. The various browser vendors are never all going to sync their release schedules for new features. Now that we have some healthy browser competition and healthy forward movement on specs we can have either a) lowest common denominator sites or b) some sites that only serve a subset of browsers and either fail or fallback to less impressive tech. Are we going to do this thing where we complain about every tech demo if it's not fully supported by all 4 or 5 major browsers? Sounds boring. When browsers come out with new features, I want to see demos showing what is possible. If you want to see it work on browser X then write a version that works on browser X and show us.
- pedrokost 16y agoCan someone post a screenshot, to see how it is suposed to look? Its all messed up in Chrome dev on Windows