View Full Version : HTML 3D example

June 5th, 2010, 03:51 AM
I just saw it on Apple's site and they don't seem to be using WebGL, yet it rotates like a true 3D scene, does anyone know how it works?

SoFl W
June 5th, 2010, 03:53 AM
<title>Safari Technology Demo - 360°</title>
<meta name="omni_page" content="HTML5 - 360°" />
<meta name="Category" content="" />
<meta name="Description" content="" />
<script src="/safaridemos/showcase/global_html5/scripts/lib/prototype.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/global_html5/scripts/lib/scriptaculous.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/global_html5/scripts/browserdetect.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/global_html5/scripts/apple_core.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/global_html5/scripts/search_decorator.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/global_html5/scripts/vr.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/scripts/library.js" type="text/javascript" charset="utf-8"></script>
<script src="/safaridemos/showcase/threesixty/scripts/threesixty.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="/safaridemos/showcase/global_html5/styles/base.css" type="text/css" />
<link rel="stylesheet" href="/safaridemos/showcase/global_html5/styles/blackout.css" type="text/css" media="screen" />
<link rel="stylesheet" href="/safaridemos/styles/html5.css" type="text/css" media="screen" />

June 5th, 2010, 03:55 AM
That doesn't answer anything, I can see the source code myself, I'm wondering what exactly are they doing to achieve this effect, for example is it a huge pile of images shown in turn or something else?

June 5th, 2010, 04:16 AM
Something like that. See the “vr.js” linked script for source code of the object that handles the animation.

June 5th, 2010, 07:06 AM
I only seem to be able to rotate the images through certain discrete angles, so I am guessing you're on the money with the guess that they're just swapping out photographs of the same items from different angles.

June 5th, 2010, 01:25 PM
That's what they're doing. Each image is labelled Seq_v04_640x378_XX.jpg

June 5th, 2010, 04:53 PM
html 5...
sign up to developer.apple.com
you'd be surprised, its not just apple only languages...

June 5th, 2010, 10:16 PM
That's what they're doing. Each image is labelled Seq_v04_640x378_XX.jpg
I see, then that's not really HTML5 stuff, but rather a blunt cheap hoax, for "real 3D" rotation see
using the daily build of Chrome or Firefox, that's WebGL in action.