Team:Cornell/sandbox

From 2013.igem.org

(Difference between revisions)
 
(355 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
+
{{:Team:Cornell/sandbox/header}}
-
<head>
+
<html>
-
<title> Parallax Test </title>
+
<head>
-
<meta name="Description" content="2014 Parallax Down" />
+
<script type="text/javascript">
-
<meta name="Keywords" content="hi this is going to be awesome" />
+
$(document).ready(function() {
-
 
+
//width of home body wrapper
-
<!--Fixes IE browser older than IE9-->
+
$(".home").height($(document).height()-200);
-
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
+
-
 
+
$(window).resize(function() {
-
<style type="text/css">
+
$(".home").height($(document).height()-200);
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
});
-
    display:none;
+
});
-
}
+
</script>
-
/* Top menu */
+
-
body {
+
-
    margin: 10px 0 0 0;
+
-
    padding: 0;
+
-
}
+
-
#top-section {
+
-
    width: 965px;
+
-
        height: 0;
+
-
        margin: 0 auto;
+
-
        padding: 0;
+
-
        border: none;
+
-
}
+
-
#menubar {
+
-
    width: auto;
+
-
    top: -14px;
+
-
}
+
-
.left-menu:hover {
+
-
  background-color: transparent;
+
-
}
+
-
#menubar li a {
+
-
  background-color: transparent;
+
-
    color: transparent;
+
-
}
+
-
#menubar:hover {
+
-
    color: white;
+
-
}
+
-
#menubar:hover li a {
+
-
    color: white;
+
-
}
+
-
#menubar > ul > li:last-child {
+
-
    display: none;
+
-
}
+
-
 
+
-
/* General */
+
-
#content {border: none;}
+
-
body {
+
-
border: none;
+
-
background: white;
+
-
font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;  
+
-
font-size: 14px;
+
-
line-height: 1;
+
-
color: black;
+
-
position: relative;
+
-
-webkit-font-smoothing: antialiased; }
+
-
p {
+
-
    margin: 0;
+
-
}
+
-
h2, h3, h4, h5, h6 {
+
-
    border: none;
+
-
    font-weight: normal;
+
-
color: black;
+
-
line-height: 1.1;
+
-
margin-bottom: 14px;  
+
-
margin-top: 14px
+
-
}
+
-
h1 { font-size: 44px; }
+
-
h2 { font-size: 37px; }
+
-
h3 { font-size: 27px; }
+
-
h4 { font-size: 23px; }
+
-
h5 { font-size: 17px; }
+
-
h6 { font-size: 14px; }
+
-
ul {
+
-
    list-style-position: inside;
+
-
    margin: 0;
+
-
}
+
-
a, a:visited, a:active, a:hover { color: #2795b6; }
+
-
    a:focus { color: #2ba6cb; outline: none; }
+
-
</style>
+
</head>
</head>
-
<body>
+
<body style="overflow: hidden">
-
<h1> Whee </h1>
+
<div class="navbar" style="position: relative; z-index: 20; margin-top: -29px;">
-
<h2> Whoo </h2>
+
<a><div class="head"> Project </div></a>
-
<h3> Poo </h3>
+
<a><div class="head"> Outreach </div></a>
-
<div> Hi </div>
+
<div class="head">
-
<p> I never use this anyways </p>
+
<img style="width: 450px; padding: 0 30px;" src="https://static.igem.org/mediawiki/2013/0/0a/Cornell_newlogo.png">
-
<div> <a href="">Link</a>
+
 +
</div>
 +
<div style="display: inline-block; position: absolute; margin-left: -210px;">
 +
<a>
 +
<img src ="https://static.igem.org/mediawiki/igem.org/6/67/IGEMsmall.png"">
 +
</a>
 +
</div>
 +
<a><div class="head"> Notebook</div></a>
 +
<a><div class="head"> Team</div></a>
 +
</div>
 +
<div class="wrapper home">
 +
<div id="first-screen" class="screen" data-speed="500" data-dist="100">
 +
<span class="layer1" style="font-size:60px; top: 20%; left: 20%;">Home Page</span>
 +
<img class="layer4 spin" src="http://www.iconarchive.com/download/i74335/visualpharm/icons8-metro-style/Very-Basic-Settings.ico" style="left: 57%; height: 90%; width: 30%;">
 +
<span class="layer1" style="left:20%; top: 45%">Use arrow keys to move through slider -></span>
 +
<span class="layer1" style="left:20%; top: 55%">I'll get mouse controls working in a bit</span>
 +
</div>
 +
<div id="second-last-screen" class="screen" data-speed="500" data-dist="100" style="left: 100%;">
 +
<span class="layer1" style="left:25%; top: 45%">There's no parallax effect right now... It's giving me some trouble</span>
 +
<span class="layer1" style="left:25%; top: 55%">Also all the colors and images are temporary -></span>
 +
</div>
 +
<div class="screen" data-speed="500" data-dist="100" style="left: 200%;">
 +
<span class="layer1" style="left:25%; top: 45%">General page layout coming soon</span>
 +
<span class="layer1" style="left:25%; top: 55%">...and the hprac page that I keep forgetting to work on</span>
 +
</div>
 +
</div>
 +
<div class="navbar" style="position: fixed; z-index: 10; bottom: -1px;">
 +
<a>
 +
<div class="tail">
 +
<span>Nickel</span>
 +
<img src="http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/512/Sport-Activities-Skydiving-gear-icon.png">
 +
</div>
 +
</a>
 +
<a>
 +
<div class="tail">
 +
<span>Mercury</span>
 +
<img src="http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/256/Accommodation-Jacuzzi-icon.png">
 +
</div>
 +
</a>
 +
<a>
 +
<div class="tail">
 +
<span style="margin-left: -7%">Lead</span>
 +
<img src="http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/256/Sport-Activities-Fishing-icon.png">
 +
</div>
 +
</a>
 +
<a>
 +
<div class="tail">
 +
<span style="margin-left: -9%">Reporters</span>
 +
<img src="http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/256/Sport-Activities-Base-jumping-icon.png">
 +
</div>
 +
</a>
 +
</div>
</body>
</body>
</html>
</html>

Latest revision as of 19:20, 19 August 2014

2014 Cornell iGEM

Home Page Use arrow keys to move through slider -> I'll get mouse controls working in a bit
There's no parallax effect right now... It's giving me some trouble Also all the colors and images are temporary ->
General page layout coming soon ...and the hprac page that I keep forgetting to work on