CSS 3D Transforms

3 views
Skip to first unread message

Bram Pitoyo

unread,
Jul 16, 2009, 5:13:58 PM7/16/09
to openwe...@googlegroups.com
Just when you thought that nothing else could possibly be included in
a CSS specification, the latest WebKit nightly build supports 3D
Transformation effect.

I could easily see this being used in web based games:
http://webkit.org/blog/386/3d-transforms/

If you want to jump right in and see a demo, make sure you’re running
recent WebKit nightly build on Leopard or later, and load this
example:
http://webkit.org/blog-files/3d-transforms/poster-circle.html

Bram Pitoyo
Presentation, Information and Experience Design & Typography
http:/www.brampitoyo.com

Kevin Searle

unread,
Jul 16, 2009, 5:19:48 PM7/16/09
to openwe...@googlegroups.com
This is in FF 3.5 as well

Bram Pitoyo

unread,
Jul 16, 2009, 5:23:15 PM7/16/09
to openwe...@googlegroups.com
Is it supported natively in FF 3.5, or in the daily Minefield build?

Maikel

unread,
Jul 16, 2009, 5:24:22 PM7/16/09
to openwe...@googlegroups.com
I'm afraid Firefox 3.5 only supports 2D CSS transforms. See: https://developer.mozilla.org/En/CSS/Using_CSS_transforms

Kevin Searle

unread,
Jul 16, 2009, 5:31:39 PM7/16/09
to openwe...@googlegroups.com
Correct, I skimmed too quickly on this article where he's using 2D CSS transforms to get 3D effects:
http://hacks.mozilla.org/2009/06/3d-transforms-isocube/

Rayne

unread,
Aug 8, 2009, 2:43:58 PM8/8/09
to openwebgames
Hi, sorry for reviving a dormant post, but I wanted to add some
opinion to this thread.

While Google/Apple/Mozilla/Opera are all working on Canvas (2d/3d) and
other HTML5 properties, I'm supposing that Apple's going to sharply
diverge from the others on CSS3 and the 3D Web, since they're (so far)
the only ones to implement CSS 2D/3D Transforms, CSS Animations and
CSS Transitions (with further extensions to tie between CSS and SVG);
meanwhile, Google's pushing their O3D through Chrome and a browser
plugin, Mozilla's only implementing Transforms, and Opera...well, to
them, it's probably just 3D canvas and JS that can suffice for the
time being.

And then, on Aug. 4, the Khronos Group announces a collaboration with
Google, Opera and Mozilla to bring Hardware-accelerated web graphics
standards to fruition. Apple is nowhere to be found in the press
release.

When I look at it from both perspectives, both might have advantages:
CSS is meant to stay out of the way when it comes to accessibility and
would easily allow website designers to create 3D objects and media
without much of any new standards training, while O3D is a cleaner
break from all existing web standards, since I assume that it won't be
blended into 2D Web media. Google's demos of O3D seem more like a web-
based answer to Second Life than Apple's demos of CSS 2D/3D Transforms
Animations.

I shot the WebKit group an email regarding whether Apple's absence
from the group is related to Google's O3D just now, and an Apple
employee replied that WebGL is already being included into WebKit (as
per this bug: http://webkit.org/b/28018 ). But I still want to know if
Apple and Google are directly competing on 3D web implementations
(using the same layout engine).

Rayne

On Jul 16, 5:31 pm, Kevin Searle <kevin.sea...@gmail.com> wrote:
> Correct, I skimmed too quickly on this article where he's using 2D CSS
> transforms to get 3D effects:http://hacks.mozilla.org/2009/06/3d-transforms-isocube/
>
> On Thu, Jul 16, 2009 at 4:24 PM, Maikel <maikelkra...@gmail.com> wrote:
> > I'm afraid Firefox 3.5 only supports 2D CSS transforms. See:
> >https://developer.mozilla.org/En/CSS/Using_CSS_transforms
>
> > On Thu, Jul 16, 2009 at 11:23 PM, Bram Pitoyo <brampit...@gmail.com>wrote:
>
> >> Is it supported natively in FF 3.5, or in the daily Minefield build?
>
> >> On Thu, Jul 16, 2009 at 2:19 PM, Kevin Searle<kevin.sea...@gmail.com>
> >> wrote:
> >> > This is in FF 3.5 as well
>
> >> > On Thu, Jul 16, 2009 at 4:13 PM, Bram Pitoyo <brampit...@gmail.com>
Reply all
Reply to author
Forward
0 new messages