Add a VirtualSky to the background of the page

slowe · Aug 15, 2013 · 022e3e4 · 022e3e4
1 parent 6baaeae
commit 022e3e4
Showing 1 changed file with 21 additions and 8 deletions.
diff --git a/index.html b/index.html
@@ -15,12 +15,25 @@
 		margin: 0px;
 		padding: 0px;
 	}
-	.container {
+	#bgholder {
+		position: absolute; 
+		left: 0px;
+		right: 0px;
+		top: 0px;
+		height: 400px;
+		width: 100%;
+	}
+	#bg { 
+		width: 100%;
+		height: 100%;
+	}
+	.content {
 		max-width:940px;
 		margin:auto;
-		padding-top: 1.5em;
-		padding-bottom: 1.5em;
 		position: relative;
+		padding: 2em;
+		background-color: white;
+		margin-top: 100px;
 	}
 	#forkme_banner {
 		background: url("http://slowe.github.io/graph/images/blacktocat.png") no-repeat scroll 95% 50% #0090FF;
@@ -33,7 +46,7 @@
 		padding: 10px 50px 10px 10px;
 		position: absolute;
 		right: 0px;
-		top: 0;
+		top: -100px;
 		z-index: 10;
 		text-decoration: none;
 	}
@@ -68,7 +81,7 @@
 		prettyPrint();
 
 		var vs = $.virtualsky({id:'starmap',projection:'stereo',gridlines_az:true,gridlines_eq:true,constellations:true,live:true,az:90});
-
+		var planetariumbg = $.virtualsky({id:'bg',az:120,gridlines_eq:true,showorbits:true,showstarlabels:true,meteorshowers:true,constellations:true,projection:'stereo',credit:false,showdate:false,showposition:false});
 		var planetarium = $.virtualsky({id:'starmap1'});
 		var planetarium2 = $.virtualsky({id:'starmap2',projection:'stereo',az:225,constellations:true,constellationboundaries:true,boundaries:[
 			["And",343,34.5,343,52.5,350,52.5,350,50,353.75,50,353.75,48,2.5,48,2.5,46,13,46,13,48,16.75,48,16.75,50,20.5,50,25,50,25,47,30.625,47,30.625,50.5,37.75,50.5,37.75,36.75,30,36.75,30,35,21.125,35,21.125,33,10.75,33,10.75,23.75,12.75,23.75,12.75,21,2.125,21,2.125,22,1,22,1,28,0,28,0,31.33333,356.25,31.33333,356.25,32.08333,352.5,32.08333,352.5,34.5,343,34.5],
@@ -101,10 +114,10 @@
 
 <body>
 
-	<div class="container">
+	<div id="bgholder"><div id="bg"></div></div>
 
+	<div class="content">
 		<a id="forkme_banner" href="https://github.com/slowe/VirtualSky">Fork Me on GitHub</a>
-
 		<h1>VirtualSky</h1>
 
 		<p>VirtualSky a browser-based planetarium from <a href="http://lcogt.net/">LCOGT</a> that lets you see what is visible in the sky from any location on Earth. It can be <a href="http://lcogt.net/virtualsky/embed/custom.html">customized and included on your own website</a>, blog etc. It is provided freely for educational and non-profit use.</p>
@@ -321,7 +334,7 @@ <h2>Technical details</h2>
 		<h2>Alternatives</h2>
 		<p>There are other browser-based planetaria available online e.g. <a href="http://ivan.ivanych.net/dev/starmap-canvas/">Ivan Boldyrev's Starchartjs</a>, <a href="http://canvas.staratlas.com/">Luther Huffman's StarAtlas</a> and <a href="http://tonightsky.free.fr/all-sky-map/">Thomas Boch's All Sky Map</a>. On the desktop, <a href="http://stellarium.org/">Stellarium</a> is a highly featured planetarium program that works on Windows, Mac and Linux platforms.</p>
 
-	</div>	
+	</div>
 </body>
 </html>