Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: 812e9f78e4
Fetching contributors…

Cannot retrieve contributors at this time

114 lines (91 sloc) 3.955 kb
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>X3DOM 1.0 - IX Special</title>
<link rel="icon" type="image/vnd.microsoft.icon" href="media/images/instantreality.ico" />
<link rel="stylesheet" type="text/css" href="http://www.x3dom.org/x3dom/src/x3dom.css" />
<link rel="stylesheet" type="text/css" href="http://www.x3dom.org/wp-content/themes/x3dom/instantreality.css" />
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="http://instantreality.org/media/css/ie-fixes.css" /><![endif]-->
<link rel="stylesheet" type="text/css" href="http://www.x3dom.org/wp-content/themes/x3dom/tables.css" media="screen, projection" />
<!-- X3DOM -->
<script type='text/javascript' src='http://www.x3dom.org/x3dom/release/x3dom.js'></script>
<link rel="stylesheet" type="text/css" href="http://www.x3dom.org/x3dom/release/x3dom.css" />
<style type="text/css">
#earth {
-webkit-animation: spinErde 1s infinite linear;
}
@-webkit-keyframes spinErde {
from { -webkit-transform: rotateY(0); }
to { -webkit-transform: rotateY(360deg); }
}
#moon {
-webkit-animation: spinMoon 27s infinite linear;
}
@-webkit-keyframes spinMoon {
from { -webkit-transform: rotateY(0) translate3d(4px,0px,0px); }
to { -webkit-transform: rotateY(360deg) translate3d(4px,0px,0px); }
}
</style>
</head>
<body style="background-color:#939393; font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:11px; height:100%; line-height:1.45em; margin:0; padding:0;">
<!-- Container -->
<div id="container">
<!-- Header -->
<h1>instantreality 1.0</h1>
<div id="branding">
<a href="http://www.x3dom.org/" title="Home"></a>
</div>
<!-- END Header -->
<!-- Navigation -->
<div id="navigation">
<div id="menu_main">&nbsp;</div>
</div>
<!-- Content -->
<div id="content">
<div id="content_right_column" style="margin-left:20px;">
<div class="post type-post hentry category-uncategorized" id="post-1007">
<div class="entry">
<h2>Mond und Erde (animiert mit CSS-Transforms)</h2>
<p><string>Hinweis:</strong> funktioniert derzeit nur auf WebKit-basierten Browsern (z.B. Chrome).</p>
<X3D xmlns="http://www.web3d.org/specifications/x3d-namespace"
id="Solsystem" width="500px" height="400px">
<Scene>
<Background backUrl="realsky_BK.jpg" bottomUrl="realsky_DN.jpg"
frontUrl="realsky_FR.jpg" leftUrl="realsky_LF.jpg"
rightUrl="realsky_RT.jpg" topUrl="realsky_UP.jpg">
</Background>
<Transform id="earth">
<Shape>
<Appearance>
<!-- set specularColor to have some shiny specular highlights -->
<Material id="mat" diffuseColor="1 1 1" specularColor=".2 .2 .2">
</Material>
<Texture><img src="earth.jpg"></Texture>
</Appearance>
<Sphere radius="1.25"></Sphere>
</Shape>
</Transform>
<Transform id="moon">
<Shape>
<Appearance>
<Material USE="mat"></Material>
<Texture><img src="moon.jpg"></Texture>
</Appearance>
<Sphere radius="0.35"></Sphere>
</Shape>
</Transform>
<!-- an additional light to brighten up the scene -->
<DirectionalLight direction='0 -1 0' intensity="0.3"></DirectionalLight>
</Scene>
</X3D>
</div>
</div>
</div>
<!-- END Content -->
<div id="footer" class="clearfix"></div>
</div>
<!-- END Container -->
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.