Team:Oxford/templates/header

From 2014.igem.org

(Difference between revisions)
 
(227 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>
+
-
<link href='http://fonts.googleapis.com/css?family=PT+Serif|Open+Sans:300italic,400,300' rel='stylesheet' type='text/css'>
+
<script>
-
 
+
$(document).ready(function() {
-
<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>
+
-
+
-
       
+
-
<div id="maximage">
+
-
<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/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 65: Line 9:
})
})
-
 
-
        </script>
 
-
 
-
        <style>
 
-
* {
+
</script>
-
    padding: 0px;
+
<style>
-
    margin: 0px
+
 
-
}
+
@import url(http://fonts.googleapis.com/css?family=PT+Serif|Open+Sans:300italic,400,300);
body {
body {
Line 84: Line 24:
padding:0;
padding:0;
background:none;
background:none;
-
overflow:hidden;
 
}
}
Line 99: 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 107: Line 46:
#menubar ul {
#menubar ul {
-
padding:0px;
+
padding:10px;
}
}
Line 140: Line 79:
#bodyContent p{
#bodyContent p{
display:none;
display:none;
-
overflow:hidden;
 
}
}
Line 234: Line 172:
display:block !important;
display:block !important;
}
}
 +
body {
body {
Line 254: Line 193:
.container{
.container{
   max-width: 920px;
   max-width: 920px;
 +
min-width:600px;
   margin: 0 auto;
   margin: 0 auto;
   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 335: 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;
height: 80px;
height: 80px;
position: absolute;
position: absolute;
-
top:55px;
+
top:35px;
-
}
+
-
 
+
-
#biochemdept {
+
-
background: url('https://static.igem.org/mediawiki/2014/0/0d/Oxford-biochemistry-logo.png');
+
-
background-size: cover;
+
-
width: 260px;
+
-
height: 73px;
+
-
position: absolute;
+
-
top:140px;
+
-
        left:5px;
+
}
}
#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:10px;
+
right: 0;
-
top:45px;
+
top:2.5em;
}
}
-
 
-
#facebook {
 
-
background: url('https://static.igem.org/mediawiki/2014/3/3d/F.png');
 
-
background-size: cover;
 
-
        width:35px;
 
-
height:35px;
 
-
position: absolute;
 
-
        left:265px;
 
-
top:60px;
 
-
}
 
-
 
-
#twitter {
 
-
background: url('https://static.igem.org/mediawiki/2014/0/02/T.png');
 
-
background-size: cover;
 
-
        width:35px;
 
-
height:35px;
 
-
position: absolute;
 
-
left:265px;
 
-
top:100px;
 
-
}
 
-
 
#logo span, #igem_logo span {
#logo span, #igem_logo span {
Line 407: 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 413: Line 314:
width: 100%;
width: 100%;
background: #012148;
background: #012148;
-
margin-bottom: 0px;
+
margin-bottom: 30px;
min-width:600px;
min-width:600px;
}
}
Line 423: 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 445: Line 344:
text-transform: uppercase;
text-transform: uppercase;
}
}
-
 
Line 524: 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;
 +
}
-
<nav id="main_navigation">
 
-
<div class="container">
 
-
<ul>
 
-
 
-
 
-
<li class="hasdropdown"><a>DCM<font style="text-transform: lowercase;">ation</font></a>
+
.growlabbookbweek1 {
-
<ul class="dropdown">
+
    border-radius: 10px;
-
<li><a href="https://2014.igem.org/Team:Oxford/ouridea">Our idea</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: 100px;
-
                                        <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;
 +
}
-
                                       
+
.growlabbookbweek1:hover {
-
</ul>
+
    overflow: hidden;
-
</li>
+
    height: 2800px;
 +
}
-
                                   
 
-
                                      <li class="hasdropdown"><a>Notebook</a>
 
-
<ul class="dropdown">
 
-
<li><a href="https://2014.igem.org/Team:Oxford/protocol">protocol</a></li>
 
-
<li><a href="https://2014.igem.org/Team:Oxford/lab_book">lab book</a></li>
 
-
                                                        <li><a href="https://2014.igem.org/Team:Oxford/parts">Parts</a></li>
 
-
                                                        <li><a href="https://2014.igem.org/Team:Oxford/references">references</a></li>
 
-
</ul>
 
-
</li>
 
-
<li class="hasdropdown"><a>Modelling</a>
+
.growlabbookbweek2 {
-
<ul class="dropdown">
+
    border-radius: 10px;
-
<li><a href="https://2014.igem.org/Team:Oxford/lab_book">A) <font style="text-transform: lowercase;">tolerance maximisation</font></a></li>
+
    display: inline-block;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/lab_book">B) <font style="text-transform: lowercase;">dcm</font>R/A <font style="text-transform: lowercase;">characterisation</font></a></li>
+
    overflow: hidden;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/lab_book">C) <font style="text-transform: lowercase;">catalysis optimisation</font></a></li>
+
    height: 150px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
<li><a href="https://2014.igem.org/Team:Oxford/progress">progress</a></li>
+
.growlabbookbweek2:hover {
-
                                                       
+
    overflow: hidden;
-
</ul>
+
    height: 6500px;
-
</li>
+
}
 +
.growlabbookbweek3 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
                                       
+
.growlabbookbweek3:hover {
-
                                       
+
    overflow: hidden;
-
</li>
+
    height: 2800px;
 +
}
-
</ul>
+
.growlabbookbweek4 {
-
</div>
+
    border-radius: 10px;
-
</nav>
+
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
.growlabbookbweek4:hover {
 +
    overflow: hidden;
 +
    height: 8000px;
 +
}
-
<header>
+
.growlabbookbweek5 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 120px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
<div class="inner">
+
.growlabbookbweek5:hover {
-
<img class="DCMationgif" src="https://static.igem.org/mediawiki/2014/8/81/DCMation1.png" height="400px" align="middle" alt="" onclick='javascript:(this.src=="https://static.igem.org/mediawiki/2014/8/81/DCMation1.png"?this.src="https://static.igem.org/mediawiki/2014/4/4f/DCMationlogo.gif":"")' />
+
    overflow: hidden;
-
</div>
+
    height: 3000px;
 +
}
-
<div class="containertwo">
 
-
                       
 
-
     
 
 +
.growlabbookcweek1 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
<div id="logo">
+
.growlabbookcweek1:hover {
-
<a href="http://www.ox.ac.uk"><span></span></a>
+
    overflow: hidden;
-
</div>
+
    height: 1950px;
 +
}
-
<div id="biochemdept">
+
.growlabbookcweek3 {
-
<a href="http://www.bioch.ox.ac.uk/"><span></span></a>
+
    border-radius: 10px;
-
</div>
+
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
-
<div href="https://igem.org/Main_Page" id="igem_logo">
+
.growlabbookcweek3:hover {
-
<a><span></span></a>
+
    overflow: hidden;
-
</div>
+
    height: 1950px;
 +
}
 +
.growlabbookcweek4 {
 +
    border-radius: 10px;
 +
    display: inline-block;
 +
    overflow: hidden;
 +
    height: 130px;
 +
    width: 100%;
 +
    margin: 0% 0px 0px 0%;
 +
    float: center;
 +
    position: relative;
 +
    transition:height 0.5s;
 +
    -webkit-transition:height 0.5s;
 +
}
 +
.growlabbookcweek4:hover {
 +
    overflow: hidden;
 +
    height: 1000px;
 +
}
-
</div>
+
.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;
 +
}
-
</header>
+
.growlabbookcweek5:hover {
-
<nav id="main_navigation">
+
    overflow: hidden;
-
<div class="container">
+
    height: 2100px;
-
<ul>
+
}
-
<li><a href="https://2014.igem.org/Team:Oxford">Homepage</a></li>
+
-
+
 +
.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;
-
<li class="hasdropdown"><a>Policy & Practices</a>
+
    height: 2100px;
-
<ul class="dropdown">
+
}
-
<li><a href="https://2014.igem.org/Team:Oxford/intellectual_property">Intellectual Property</a></li>
+
.growGW {
-
<li><a href="https://2014.igem.org/Team:Oxford/safety">safety</a></li>
+
    border-radius: 10px;
-
<li><a href="https://2014.igem.org/Team:Oxford/public_engagement">Public Engagement</a></li>
+
    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 {
-
</ul>
+
    overflow: hidden;
-
</li>
+
    height: 1000px;
 +
}
-
+
.grow3 {
-
<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: 300px;
-
                                        <li><a href="https://2014.igem.org/Team:Oxford/events">Events</a></li>
+
    width: 50%;
-
                                        <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;
 +
}
 +
.grow3:hover {
 +
    overflow: hidden;
 +
    width: 100%;
 +
}
-
  <li class="hasdropdown"><a>Team</a>
 
-
<ul class="dropdown">
 
-
<li><a href="https://2014.igem.org/Team:Oxford/students">Students</a></li>
 
-
<li><a
 
-
href="https://2014.igem.org/Team:Oxford/supervisors">Supervisors</a></li>
 
-
<li><a
 
-
href="https://2014.igem.org/Team:Oxford/advisors">Advisors</a></li>
 
-
<li><a href="https://2014.igem.org/Team:Oxford/sponsors">Sponsors</a></li>
 
-
</ul>
 
-
</li>
 
-
                                       
 
-
                                       
 
-
</li>
 
-
</ul>
+
</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

Retrieved from "http://2014.igem.org/Team:Oxford/templates/header"