I think a bit of JS is being used to create the DIV structure, but that's not important.
It could also be improved a bit: you could remove the shading gradient from the Coke can mask PNG, and render the shading using an CSS gradient with RGBA values.
That would mimic the specular highlighting, and you could also animate the shading.
I still haven't quite grok'd the displacement method though... it must be carefully calculated background x pos offsets? (I don't have firebug on this machine)
Looks like it's just slicing up a wraparound texture vertically -- no scaling, just subsampling. The can and highlight are just composited on top. Slick and clever.
Note that it's really not "3D" in a meaningful sense. It's doing pixel-aligned warping only, and is hard-coded to a cylinder (any "lathe" shape would also work). This is the same trick that the Amiga used for the bouncing ball in 1985.
I think it could be used on any kind of catalog page to allow users to rotate the product image. Wonder what it would take to add a vertical scroll so you could rotate it in any direction. This kind of image manipulation is something I have no experience in.
Perhaps. And the focus was even more sharp in the early days, when the name was still "startup news". Still, interesting hacks seems to have their place here.
This experiment is definitely worthy of a post. I haven't looked at how he did that or the "CSS Bird" shadow effect but I'm impressed that can be done without Javascript.
Were it CPU intensive it would be so on the client side and have no affect on the server, and fwiw, scrolling back and forth quickly I saw no cpu spike (fairly new MBP, granted).
It's more likely that the site has been taken down by being posted on sites like HN/reddit/digg/etc (it was easier when we could just say it was "the /. effect").
