Team:Oxford/templates/header

From 2014.igem.org

(Difference between revisions)
 
(280 intermediate revisions not shown)
Line 1: Line 1:
-
<!--[if lt IE 7]> <html lang="en" class="no-js ie6"> <![endif]-->
+
<html>
-
<!--[if IE 7]>    <html lang="en" class="no-js ie7"> <![endif]-->
+
-
<!--[if IE 8]>    <html lang="en" class="no-js ie8"> <![endif]-->
+
-
<!--[if gt IE 8]><!-->
+
-
<html class='no-js' lang='en'>
+
-
<!--<![endif]-->
+
-
<head>
+
-
<meta charset='utf-8' />
+
-
<meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible' />
+
-
<meta content='jQuery Plugin to make jQuery Cycle Plugin work as a fullscreen background image slideshow' name='description' />
+
-
+
-
<meta name="distribution" content="global" />
+
-
<meta name="language" content="en" />
+
-
<meta content='width=device-width, initial-scale=1.0' name='viewport' />
+
-
+
-
<link rel="stylesheet" href="https://dl.dropbox.com/s/vk19uzv3h0b39rn/jquery.maximage.css" type="text/css" media="screen" charset="utf-8" />
+
-
<link rel="stylesheet" href="https://dl.dropbox.com/s/vvujeoveawsd2wz/screen.css" type="text/css" media="screen" charset="utf-8" />
+
-
+
-
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
+
-
+
-
<style type="text/css" media="screen">
+
-
#maximage {
+
-
/* position:fixed !important;*/
+
-
}
+
-
+
-
</style>
+
-
+
-
<!--[if IE 6]>
+
-
<style type="text/css" media="screen">
+
-
/*I don't feel like messing with pngs for this browser... sorry*/
+
-
#gradient {display:none;}
+
-
</style>
+
-
<![endif]-->
+
-
</head>
+
-
+
-
   
+
-
   
+
-
    <body>
+
-
+
-
       
+
-
       
+
-
       
+
-
       
+
-
   
+
<script>
-
       
+
 
-
<div id="maximage">
+
$(document).ready(function() {
-
<img src="https://static.igem.org/mediawiki/2014/3/3d/Oxskyline.png" alt="" width="1400" height="1050" />
+
-
<img src="https://static.igem.org/mediawiki/2014/2/2a/DcmA-3.png" alt="Coalesse" width="1400" height="1050" />
+
-
<img src="https://static.igem.org/mediawiki/2014/0/09/BrownBiochemistry_04.jpg" alt="" width="1400" height="1050" /></div>
+
-
+
-
       
+
-
       
+
-
       
+
-
       
+
-
       
+
-
       
+
-
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js'></script>
+
-
<script src="https://dl.dropbox.com/s/37jkgtqvovibjzw/jquery.cycle.all.js" type="text/javascript" charset="utf-8"></script>
+
-
<script src="https://dl.dropbox.com/s/pidq1kmneunnn0s/jquery.maximage.js" type="text/javascript" charset="utf-8"></script>
+
-
+
-
<script type="text/javascript" charset="utf-8">
+
-
$(function(){
+
-
// Trigger maximage
+
-
jQuery('#maximage').maximage();
+
-
});
+
-
+
-
$(document).ready(function() {
+
$('.hasdropdown').hover(function() {
$('.hasdropdown').hover(function() {
$(this).find('.dropdown').stop(true,true).slideToggle(200);
$(this).find('.dropdown').stop(true,true).slideToggle(200);
Line 72: Line 9:
})
})
-
 
-
        </script>
 
-
 
-
        <style>
 
-
@import url(http://fonts.googleapis.com/css?family=PT+Serif|Open+Sans:300italic,400,300);
+
</script>
 +
<style>
-
* {
+
@import url(http://fonts.googleapis.com/css?family=PT+Serif|Open+Sans:300italic,400,300);
-
    padding: 0px;
+
-
    margin: 0px
+
-
}
+
body {
body {
Line 93: Line 24:
padding:0;
padding:0;
background:none;
background:none;
-
overflow:hidden;
 
}
}
Line 108: Line 38:
white-space: nowrap;
white-space: nowrap;
top: 0px;
top: 0px;
-
width: 450px;
+
width: 400px;
z-index: 5;
z-index: 5;
font-family: sans-serif;
font-family: sans-serif;
Line 149: Line 79:
#bodyContent p{
#bodyContent p{
display:none;
display:none;
-
overflow:hidden;
 
}
}
Line 243: Line 172:
display:block !important;
display:block !important;
}
}
 +
body {
body {
Line 267: Line 197:
   display: block !important;
   display: block !important;
   -webkit-backface-visibility: hidden;  
   -webkit-backface-visibility: hidden;  
-
position: relative;
+
position: relative;   
-
}
+
-
 
+
-
.header .containertwo{
+
-
  max-width: 920px;
+
-
min-width:600px;
+
-
margin: 0 auto;
+
-
overflow:hidden;
+
}
}
Line 345: Line 268:
header {
header {
-
background:  
+
background: url('https://static.igem.org/mediawiki/2014/e/eb/Oxfordigem_radcam.jpg');
-
+
-
;
+
background-size: cover;
background-size: cover;
-
background-position: center center;
+
background-position: 10% 16%;
-
height: 400px;
+
height: 300px;
min-width:600px;
min-width:600px;
}
}
#logo {
#logo {
-
background: url('https://static.igem.org/mediawiki/2014/thumb/5/5a/Oxfordlogo.png/800px-Oxfordlogo.png');
+
background: url('https://static.igem.org/mediawiki/2014/8/8a/Lgoo.png');
background-size: cover;
background-size: cover;
width: 260px;
width: 260px;
Line 365: Line 286:
#igem_logo {
#igem_logo {
-
background: url('https://static.igem.org/mediawiki/2010/b/b0/UCL-Igem.png');
+
background: url('https://static.igem.org/mediawiki/2014/6/6d/OxiGEMiGEM.png');
background-size: cover;
background-size: cover;
-
width: 10em;
+
width: 9em;
-
height: 8em;
+
height: 7em;
position: absolute;
position: absolute;
right: 0;
right: 0;
Line 386: Line 307:
   /* edit: fixes overlap error in IE7/8,  
   /* edit: fixes overlap error in IE7/8,  
     make sure you have an empty gif */
     make sure you have an empty gif */
 +
   background-image: url('empty.gif');
   background-image: url('empty.gif');
}
}
Line 392: Line 314:
width: 100%;
width: 100%;
background: #012148;
background: #012148;
-
margin-bottom: 0px;
+
margin-bottom: 30px;
min-width:600px;
min-width:600px;
}
}
Line 402: Line 324:
#main_navigation > div > ul > li {
#main_navigation > div > ul > li {
display: inline-block;
display: inline-block;
-
margin: 0;
+
margin: 0 20px 0 0 ;
-
margin-left:30px;
+
-
 
+
padding: 0;
padding: 0;
}
}
Line 424: Line 344:
text-transform: uppercase;
text-transform: uppercase;
}
}
-
 
Line 503: Line 422:
background: #fff;
background: #fff;
padding: 1em;
padding: 1em;
 +
width:90%;
}
}
-
.abcdefg {
+
 
-
margin-bottom: 1em;
+
 
-
background: #f5f5f5;
+
.grow {
-
padding: 1em;
+
    border-radius: 10px;
-
        bottom:0px;
+
    display: inline-block;
-
     
+
    overflow: hidden;
 +
    height: 20px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
}
}
-
IMG.DCMationgif{
+
.grow:hover {
 +
    overflow: hidden;
 +
    height: 100px;
 +
}
 +
 
 +
 
 +
.growat {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 400px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
     position: relative;
     position: relative;
-
     left: -50%;
+
     transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
}
}
-
.inner {
+
.growat:hover {
 +
    overflow: hidden;
 +
    height: 1000px;
 +
}
 +
 
 +
.growbio {
 +
    border-radius: 10px;
     display: inline-block;
     display: inline-block;
 +
    overflow: hidden;
 +
    height: 250px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
     position: relative;
     position: relative;
-
     right: -50%;
+
     transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
}
}
-
</style>
+
.growbio:hover {
 +
    overflow: hidden;
 +
    height: 1000px;
 +
}
-
<header>
 
-
<div class="inner">
 
-
<img class="DCMationgif" src="https://static.igem.org/mediawiki/2014/9/99/Firstframe.png" height="400px" align="middle" alt="" onclick='javascript:(this.src=="https://static.igem.org/mediawiki/2014/9/99/Firstframe.png"?this.src="http://timertopia.files.wordpress.com/2012/02/20-second-timer.gif":"")' />
 
-
</div>
 
-
<div class="containertwo">
+
.growlabbookbweek1 {
-
                       
+
    border-radius: 10px;
-
     
+
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 100px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
.growlabbookbweek1:hover {
 +
    overflow: hidden;
 +
    height: 2800px;
 +
}
-
<div id="logo">
 
-
<a href="http://www.ox.ac.uk"><span></span></a>
 
-
</div>
 
 +
.growlabbookbweek2 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 150px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
.growlabbookbweek2:hover {
 +
    overflow: hidden;
 +
    height: 6500px;
 +
}
-
<div href="https://igem.org/Main_Page" id="igem_logo">
+
.growlabbookbweek3 {
-
<a href="https://igem.org/Main_Page"><span></span></a>
+
    border-radius: 10px;
-
</div>
+
    display: inline-block;
-
</div>
+
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
</header>
+
.growlabbookbweek3:hover {
-
<nav id="main_navigation">
+
    overflow: hidden;
-
<div class="container">
+
    height: 2800px;
-
<ul>
+
}
-
<li><a href="https://2014.igem.org/Team:Oxford">Homepage</a></li>
+
-
+
-
<li class="hasdropdown"><a>DCM<font style="text-transform: lowercase;">ation</font></a>
+
.growlabbookbweek4 {
-
<ul class="dropdown">
+
    border-radius: 10px;
-
<li><a href="https://2014.igem.org/Team:Oxford/ouridea">Overview</a></li>
+
    display: inline-block;
-
<li><a href="https://2014.igem.org/Team:Oxford/DCMationA">A) <font style="text-transform: lowercase;">tolerance maximisation</font></a></li>
+
    overflow: hidden;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/DCMationB">B) <font style="text-transform: lowercase;">dcm</font>R/A <font style="text-transform: lowercase;">characterisation</font></a></li>
+
    height: 130px;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/DCMationC">C) <font style="text-transform: lowercase;">catalysis optimisation</font></a></li>
+
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
                                       
+
.growlabbookbweek4:hover {
-
</ul>
+
    overflow: hidden;
-
</li>
+
    height: 8000px;
 +
}
-
                                   
+
.growlabbookbweek5 {
-
                                      <li class="hasdropdown"><a>Notebook</a>
+
    border-radius: 10px;
-
<ul class="dropdown">
+
    display: inline-block;
-
<li><a href="https://2014.igem.org/Team:Oxford/methods">Methods</a></li>
+
    overflow: hidden;
-
<li><a href="https://2014.igem.org/Team:Oxford/data">data</a></li>
+
    height: 120px;
-
                                                        <li><a href="https://2014.igem.org/Team:Oxford/parts">Parts</a></li>
+
    width: 100%;
-
                                                        <li><a href="https://2014.igem.org/Team:Oxford/references">references</a></li>
+
    margin: 0% 0px 0px 0%;
-
</ul>
+
    float: center;
-
</li>
+
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
<li class="hasdropdown"><a>Modelling</a>
+
.growlabbookbweek5:hover {
-
<ul class="dropdown">
+
    overflow: hidden;
-
<li><a href="https://2014.igem.org/Team:Oxford/modellingA">A) <font style="text-transform: lowercase;">tolerance maximisation</font></a></li>
+
    height: 3000px;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/modellingB">B) <font style="text-transform: lowercase;">dcm</font>R/A <font style="text-transform: lowercase;">characterisation</font></a></li>
+
}
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/modellingC">C) <font style="text-transform: lowercase;">catalysis optimisation</font></a></li>
+
-
                                                        <li><a href="https://2014.igem.org/Team:Oxford/achievements">achievements</a></li>
+
-
</ul>
+
-
</li>
+
-
+
.growlabbookcweek1 {
-
+
    border-radius: 10px;
-
<li class="hasdropdown"><a>Human Practices</a>
+
    display: inline-block;
-
<ul class="dropdown">
+
    overflow: hidden;
-
<li><a href="https://2014.igem.org/Team:Oxford/intellectual_property">Intellectual Property</a></li>
+
    height: 130px;
-
<li><a href="https://2014.igem.org/Team:Oxford/safety">safety</a></li>
+
    width: 100%;
-
<li><a href="https://2014.igem.org/Team:Oxford/public_engagement">Public Engagement</a></li>
+
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
+
.growlabbookcweek1:hover {
-
</ul>
+
    overflow: hidden;
-
</li>
+
    height: 1950px;
 +
}
-
+
.growlabbookcweek3 {
-
<li class="hasdropdown"><a><font style="text-transform: lowercase;">i</font>GEM Community</a>
+
    border-radius: 10px;
-
<ul class="dropdown">
+
    display: inline-block;
-
    <li><a href="https://2014.igem.org/Team:Oxford/collaboration">Collaboration</a></li>
+
    overflow: hidden;
-
+
    height: 130px;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/events">Events</a></li>
+
    width: 100%;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/gallery">Gallery</a></li>
+
    margin: 0% 0px 0px 0%;
-
<li><a href="https://2014.igem.org/Team:Oxford/contactus">Contact Us</a></li>
+
    float: center;
-
</ul>
+
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
.growlabbookcweek3:hover {
 +
    overflow: hidden;
 +
    height: 1950px;
 +
}
-
  <li class="hasdropdown"><a>Team</a>
+
.growlabbookcweek4 {
-
<ul class="dropdown">
+
    border-radius: 10px;
-
<li><a href="https://2014.igem.org/Team:Oxford/students">Students</a></li>
+
    display: inline-block;
-
<li><a
+
    overflow: hidden;
-
href="https://2014.igem.org/Team:Oxford/supervisors">Supervisors</a></li>
+
    height: 130px;
-
<li><a
+
    width: 100%;
-
href="https://2014.igem.org/Team:Oxford/advisors">Advisors</a></li>
+
    margin: 0% 0px 0px 0%;
-
<li><a href="https://2014.igem.org/Team:Oxford/sponsors">Sponsors</a></li>
+
    float: center;
-
</ul>
+
    position: relative;
-
</li>
+
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
                                       
+
.growlabbookcweek4:hover {
-
                                       
+
    overflow: hidden;
-
</li>
+
    height: 1000px;
 +
}
-
</ul>
+
.growlabbookcweek5 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 250px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
 
 +
.growlabbookcweek5:hover {
 +
    overflow: hidden;
 +
    height: 2100px;
 +
}
 +
 
 +
.growlabbookcweek6 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 200px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
 
 +
.growlabbookcweek6:hover {
 +
    overflow: hidden;
 +
    height: 2100px;
 +
}
 +
.growGW {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 200px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
 
 +
.growGW:hover {
 +
    overflow: hidden;
 +
    height: 1000px;
 +
}
 +
 
 +
.grow3 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 300px;
 +
    width: 50%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
 
 +
.grow3:hover {
 +
    overflow: hidden;
 +
    width: 100%;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
<header>
 +
<div class="container">
 +
<div id="logo">
 +
<a href="http://www.ox.ac.uk"><span></span></a>
 +
</div>
 +
<div href="https://igem.org/Main_Page" id="igem_logo">
 +
<a href="https://igem.org/Main_Page"><span></span></a>
 +
</div>
</div>
</div>
-
</nav>
+
</header>
-
     
+
 
-
  </body>
 
-
 
 
-
 
 
</html>
</html>
 +
{{:Team:Oxford/templates/nav}}

Latest revision as of 09:18, 9 September 2014