Team:ETH Zurich/Templates/Header

From 2011.igem.org

(Difference between revisions)
 
(137 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<head>
+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
+
<script type="text/javascript" src="/wiki/images/c/c4/Jquery.swfobject.1-1-1.min.txt"></script>
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.min.js"></script>
+
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.6/tiny/jquery.tools.min.js"></script>
-
<style type="text/css">
+
 
-
#overview a {
+
-
color: #548C82
+
-
}
+
-
#biology a {
+
-
color: #31695E
+
-
}
+
-
#modeling a {
+
-
color: #1A473F
+
-
}
+
-
#achievements a {
+
-
color: #09241F
+
-
}
+
-
#team a {
+
-
color: #000D0A
+
-
}
+
-
</style>
+
<script type="text/javascript">
<script type="text/javascript">
var colors = new Array();
var colors = new Array();
colors["overview"] = "#548C82";
colors["overview"] = "#548C82";
colors["biology"] = "#31695E";
colors["biology"] = "#31695E";
 +
        colors["process"] = "#26584F";
colors["modeling"] = "#1A473F";
colors["modeling"] = "#1A473F";
colors["achievements"] = "#09241F";
colors["achievements"] = "#09241F";
colors["team"] = "#000D0A";
colors["team"] = "#000D0A";
 +
 +
var backgrounds = new Array();
 +
backgrounds["overview"] = "/wiki/images/e/e2/ETHZ-bg-overview.png";
 +
backgrounds["biology"] = "/wiki/images/0/03/ETHZ-bg-biology.png";
 +
        backgrounds["process"] = "/wiki/images/a/ac/ETHZ-bg-process.png";
 +
backgrounds["modeling"] = "/wiki/images/b/b8/ETHZ-bg-modeling.png";
 +
backgrounds["achievements"] = "/wiki/images/3/3d/ETHZ-bg-achievements.png";
 +
backgrounds["team"] = "/wiki/images/e/ed/ETHZ-bg-team.png";
 +
 +
        var lastPage = '';
var currSection = "</html>{{{currSection}}}<html>";
var currSection = "</html>{{{currSection}}}<html>";
-
var currPage = "</html>{{{currPage}}}<html>";
+
var currPage = "</html>{{{currPage}}}<html>";
function restoreMenu(fadeOutOnly)
function restoreMenu(fadeOutOnly)
Line 52: Line 47:
obj.children().stop(true).animate({color: 'white'}, 500);
obj.children().stop(true).animate({color: 'white'}, 500);
$('#headpic').stop(true).delay(200).animate({ backgroundColor: colors[currSection]}, 500);
$('#headpic').stop(true).delay(200).animate({ backgroundColor: colors[currSection]}, 500);
-
$('.'+currSection).stop(true).delay(400).fadeIn(500);
+
$('.'+currSection+'Sub').stop(true).delay(400).fadeIn(500);
}
}
-
 
}
}
}
}
Line 74: Line 68:
     $('#menulist li').mouseover(function(){
     $('#menulist li').mouseover(function(){
// $('.listhead').not('.curlink').css("color","#ffffff");
// $('.listhead').not('.curlink').css("color","#ffffff");
-
restoreMenu(true);
+
 
-
+
var foo = $(this).attr('id');
var foo = $(this).attr('id');
 +
if (foo != lastPage)
 +
{
 +
  $('#overlayFront').stop(true).css('background-image', $('#overlay').css('background-image'));
 +
  $('#overlayFront').stop(true).animate({opacity: 1}, 0);
 +
  $('#overlay').stop(true).animate({opacity: 0}, 0);
 +
  $('#overlay').stop(true).css('background-image', 'url(' + backgrounds[foo] + ')');
 +
 
 +
  $('#overlayFront').stop(true).animate({opacity: 0}, 500);
 +
  $('#overlay').stop(true).delay(400).animate({opacity: 1}, 500);
 +
 +
  lastPage = foo;
 +
}
 +
 +
 +
restoreMenu(true);
 +
$(this).stop(true).animate({ backgroundColor: colors[foo] }, 500);
$(this).stop(true).animate({ backgroundColor: colors[foo] }, 500);
$(this).children().stop(true).animate({color: 'white'}, 500);
$(this).children().stop(true).animate({color: 'white'}, 500);
Line 85: Line 94:
var vActive = $(this).attr("id");
var vActive = $(this).attr("id");
-
$('.'+vActive).stop(true).delay(400).fadeIn(500);
+
$('.'+vActive+'Sub').stop(true).delay(400).fadeIn(500);
     });
     });
Line 97: Line 106:
});
});
</script>
</script>
-
<style type="text/css">
 
-
/*
 
-
a:link {
 
-
color:#20548f;
 
-
}
 
-
a:visited {
 
-
color:#20548f;
 
-
}
 
-
a:hover {
 
-
color:#20548f;
 
-
}
 
-
a:active {
 
-
color:#20548f;
 
-
}*/
 
-
#top-section {
 
-
background-color: #ffffff;
 
-
height: 100px;
 
-
border: none;
 
-
width:910px;
 
-
height:20px
 
-
}
 
-
#p-logo {
 
-
position: absolute;
 
-
display: none;
 
-
}
 
-
#search-controls {
 
-
display: none;
 
-
}
 
-
#menubar
 
-
{
 
-
background-color: white;
 
-
}
 
-
#menubar.left-menu {
 
-
position: absolute;
 
-
top:0px;
 
-
left:0px;
 
-
}
 
-
#menubar.right-menu {
 
-
position: absolute;
 
-
top:0px;
 
-
right:0px;
 
-
}
 
-
#pt-userpage, #pt-logout, #pt-preferences {background-color: white}
 
-
#menubar a:active, #menubar a:hover, #menubar a:link, #menubar a:visited {
 
-
color: #000000;
 
-
background-color: white;
 
-
}
 
-
#footer-box {
 
-
width:900px;
 
-
}
 
-
body {
 
-
background-color: #AAAAAA
 
-
}
 
-
.firstHeading {
 
-
display: none;
 
-
}
 
-
#content {
 
-
width: 900px;
 
-
border: none;
 
-
font-family: helvetica, arial, sans-serif;
 
-
color: #555555
 
-
}
 
-
#title {
 
-
width:900px;
 
-
height:80px;
 
-
position: relative;
 
-
background-color: #FFFFFF;
 
-
top: 0px;
 
-
left: 0px;
 
-
}
 
-
#paralogo {
 
-
width:400px;
 
-
height:55px;
 
-
position: relative;
 
-
top: 0px;
 
-
left: 0px;
 
-
}
 
-
#bsselogo {
 
-
width:200px;
 
-
height:50px;
 
-
position: absolute;
 
-
top: 10px;
 
-
left: 435px;
 
-
}
 
-
#igemlogo {
 
-
position:absolute;
+
<link rel="stylesheet" href="https://2011.igem.org/Team:ETH_Zurich/Templates/StyleSheet?action=raw&amp;ctype=text/css" type="text/css" />
-
top:20px;
+
-
left:785px;
+
-
}
+
-
#ethlogo {
+
-
width:140px;
+
-
height:55px;
+
-
position:absolute;
+
-
top:30px;
+
-
left:570px;
+
-
}
+
-
img {
+
-
border:0px;
+
-
}
+
-
#csbl {
+
-
width:140px;
+
-
height:35px;
+
-
}
+
-
#menu {
+
-
width:900px;
+
-
height:150px;
+
-
position: relative;
+
-
top: 20px;
+
-
left: 0px;
+
-
}
+
-
#menuback {
+
-
width:150px;
+
-
height:150px;
+
-
position: absolute;
+
-
top: 0px;
+
-
left: 0px;
+
-
background-color: #ffffff;
+
-
}
+
-
#headpic {
+
-
width:750px;
+
-
height:150px;
+
-
position: absolute;
+
-
top: 0px;
+
-
left: 150px;
+
-
background-color: #888888;
+
-
}
+
-
#headover {
+
-
width: 750px;
+
-
height: 150px;
+
-
position: absolute;
+
-
top: 0px;
+
-
left: 0px;
+
-
z-index: 10000;
+
-
 
+
-
}
+
-
#overlay {
+
-
width: 750px;
+
-
height: 150px;
+
-
position: absolute;
+
-
top: 0px;
+
-
left: 0px;
+
-
background-image: url('/wiki/images/5/58/Back-2.png');
+
-
}
+
-
a {
+
-
outline:none;
+
-
}
+
-
#headtit {
+
-
font-family: helvetica, arial, sans-serif;
+
-
font-size: 1.2em;
+
-
color: #ffffff;
+
-
position: absolute;
+
-
top: 0em;
+
-
right: 10px;
+
-
height: 30px;
+
-
line-height: 30px;
+
-
vertical-align: middle;
+
-
border: 0; padding: 0; margin: 0;
+
-
}
+
-
.dark {
+
-
color: #dddddd;
+
-
}
+
-
.highlight {
+
-
color: #ea8828;
+
-
}
+
-
#menulist {
+
-
position: absolute;
+
-
top: 0px; /* 16px; */
+
-
border: 0;
+
-
margin: 0;
+
-
padding: 0;
+
-
left: 0px;
+
-
width:100%;
+
-
list-style: none;
+
-
}
+
-
#menulist li {
+
-
        padding-left: 8px;
+
-
line-height: 30px;
+
-
height: 30px;
+
-
width: 100%;
+
-
vertical-align: bottom;
+
-
border: 0px;
+
-
margin: 0px;
+
-
list-style: none;
+
-
}
+
-
#menulist li a {
+
-
font-weight: 600;
+
-
        font-size: 1.2em;
+
-
text-decoration: none;
+
-
font-family: helvetica, arial, sans-serif;
+
-
+
-
/* color: #ffffff; */}
+
-
 
+
-
#headover ul {
+
-
+
-
/* display: none;  */
+
-
position: absolute;
+
-
top: 0px; /* 1.2em; */
+
-
border: 0px;
+
-
margin-top: 0px;
+
-
margin-bottom: 0px;
+
-
padding-top: 0px;
+
-
padding-bottom: 0px;
+
-
left: 0; /* 0.2em; */
+
-
list-style:none;
+
-
list-style-image: none;
+
-
}
+
-
#headover ul ul {
+
-
position: absolute;
+
-
width:15em;
+
-
top:0px;
+
-
left: 15em;
+
-
list-style:none;
+
-
}
+
-
#headover ul li {
+
-
list-style: none;
+
-
line-height: 30px;
+
-
        height: 30px;
+
-
margin: 0px;
+
-
}
+
-
#headover ul li a {
+
-
font-weight: 600;
+
-
font-size: 1.2em;
+
-
text-decoration: none;
+
-
font-family: helvetica, arial, sans-serif;
+
-
color: #dddddd;
+
-
}
+
-
.submenu
+
-
{
+
-
display: none;
+
-
}
+
-
</style>
+
<style type="text/css">
<style type="text/css">
</html> {{{css|}}} <html>
</html> {{{css|}}} <html>
</style>
</style>
-
</head>
+
<div id="preload">
-
<body>
+
  <img src="/wiki/images/e/e2/ETHZ-bg-overview.png" width="1" height="1" alt="Menu image preload" />
 +
  <img src="/wiki/images/0/03/ETHZ-bg-biology.png" width="1" height="1" alt="Menu image preload" />
 +
  <img src="/wiki/images/a/ac/ETHZ-bg-process.png" width="1" height="1" alt="Menu image preload" />
 +
  <img src="/wiki/images/b/b8/ETHZ-bg-modeling.png" width="1" height="1" alt="Menu image preload" />
 +
  <img src="/wiki/images/3/3d/ETHZ-bg-achievements.png" width="1" height="1" alt="Menu image preload" />
 +
  <img src="/wiki/images/e/ed/ETHZ-bg-team.png" width="1" height="1" alt="Menu image preload" />
 +
</div>
 +
<div id="easteregg" style="position:absolute; left:200px; top:100px;display:none;z-index:99999999">
 +
<iframe title="YouTube video player" class="youtube-player" type="text/html" width="400" height="325" src="http://www.youtube.com/embed/n8FM8nyy_Fk?hd=1" frameborder="0"></iframe>
 +
</div>
<div id='title'>
<div id='title'>
-
   <div id='paralogo'> <a href='/Team:ETH_Zurich'> <img src='/wiki/images/5/5f/ETH_Zurich_iGEM_new.png'> </a> </div>
+
   <div id='smocolilogo'> <a href='/Team:ETH_Zurich'> <img src='/wiki/images/5/5f/ETH_Zurich_iGEM_new.png'> </a> </div>
-
   <div id='bsselogo'> <a href='http://www.bsse.ethz.ch' target="_blank"><img src='/wiki/images/0/08/BSSE_small.png'></a> </div>
+
   <!--<div id='bsselogo'> <a href='http://www.bsse.ethz.ch' target="_blank"><img src='/wiki/images/0/08/BSSE_small.png'></a> </div>-->
-
   <div id='ethlogo'> <a href='http://www.ethz.ch' target="_blank"> <img src='/wiki/images/d/da/ETH_Zurich_Logo.png'> </a> </div>
+
   <div id='slogan'><b><a href="#" onclick="document.getElementById('easteregg').style.display='block'" style="text-decoration:none;color:#000000;">Can you feel the smoke tonight?</a></b></div>
 +
  <!-- <div id='ethlogo'> <a href='http://www.ethz.ch' target="_blank"> <img src='/wiki/images/d/da/ETH_Zurich_Logo.png'> </a> </div>-->
   <div id='igemlogo'> <a href='https://2011.igem.org'> <img src='/wiki/images/f/fb/IGEM_small.png'> </a> </div>
   <div id='igemlogo'> <a href='https://2011.igem.org'> <img src='/wiki/images/f/fb/IGEM_small.png'> </a> </div>
</div>
</div>
Line 343: Line 132:
   <div id='menuback'>
   <div id='menuback'>
     <ul id='menulist'>
     <ul id='menulist'>
-
       <li id='overview'><a href='/Team:ETH_Zurich' class='listhead' >Overview</a></li>
+
       <li id='overview' class='overview overviewTitle'><a href='/Team:ETH_Zurich' class='listhead'>Overview</a></li>
-
       <li id='biology'><a href='/Team:ETH_Zurich/Biology' class='listhead' >Biology</a></li>
+
       <li id='biology' class='biology biologyTitle'><a href='/Team:ETH_Zurich/Biology' class='listhead' >Biology</a></li>
-
       <li id='modeling'><a href='/Team:ETH_Zurich/Modeling' class='listhead' >Modeling</a></li>
+
      <li id='process' class='process processTitle'><a href='/Team:ETH_Zurich/Process/Microfluidics' class='listhead' >Microfluidics</a></li>
-
       <li id='achievements'><a href='/Team:ETH_Zurich/Achievements' class='listhead' >Achievements</a></li>
+
       <li id='modeling' class='modeling modelingTitle'><a href='/Team:ETH_Zurich/Modeling' class='listhead' >Modeling</a></li>
-
       <li id='team'><a href='/Team:ETH_Zurich/Team' class='listhead' >Team</a></li>
+
       <li id='achievements' class='achievements achievementsTitle'><a href='/Team:ETH_Zurich/Achievements/Data_page' class='listhead' >Human practices</a></li>
 +
       <li id='team' class='team teamTitle'><a href='/Team:ETH_Zurich/Team' class='listhead' >Team</a></li>
     </ul>
     </ul>
   </div>
   </div>
   <div id='headpic'>
   <div id='headpic'>
 +
    <div id='overlayBack'></div>
     <div id='overlay'></div>
     <div id='overlay'></div>
 +
    <div id='overlayFront'></div>
     <div id='headover'>
     <div id='headover'>
-
       <p id='headtit'>SmoColi<span class='dark'> &nbsp;<span class='highlight'>|</span>&nbsp;&nbsp;Detect when <i>your</i> party is on</span></p>
+
       <!--<p id='headtit'>SmoColi<span class='dark'> &nbsp;<span class='highlight'>|</span>&nbsp;&nbsp;Detect when <i>your</i> party is on</span></p>-->
-
       <ul class='overview submenu'>
+
       <ul class='overviewSub submenu'>
         <li><a href='/Team:ETH_Zurich' class='listmain'>Introduction</a></li>
         <li><a href='/Team:ETH_Zurich' class='listmain'>Introduction</a></li>
         <li><a href='/Team:ETH_Zurich/Overview/Project' class='listmain'>Project Idea</a></li>
         <li><a href='/Team:ETH_Zurich/Overview/Project' class='listmain'>Project Idea</a></li>
 +
        <li><a href='/Team:ETH_Zurich/Overview/CircuitDesign' class='listmain'>Circuit Design</a></li>
 +
        <li><a href='/Team:ETH_Zurich/Achievements/Data_page' class='listmain'>Data page</a></li>
       </ul>
       </ul>
-
       <ul class='biology submenu'>
+
       <ul class='biologySub submenu'>
         <li><a href='/Team:ETH_Zurich/Biology' class='listmain'>Overview</a></li>
         <li><a href='/Team:ETH_Zurich/Biology' class='listmain'>Overview</a></li>
-
         <li><a href='/Team:ETH_Zurich/Biology/Detector' class='listmain'>Acetaldehyde detector</a></li>
+
         <li><a href='/Team:ETH_Zurich/Biology/Detector' class='listmain'>Network Elements</a></li>
-
         <li><a href='/Team:ETH_Zurich/Biology/Bandpass' class='listmain'>Bandpass filter</a></li>
+
         <li><a href='/Team:ETH_Zurich/Biology/MolecularMechanism' class='listmain'>Genetic Design</a></li>
-
         <li><a href='/Team:ETH_Zurich/Biology/Cloning' class='listmain'>Implementation</a></li>
+
         <li><a href='/Team:ETH_Zurich/Biology/Validation' class='listmain'>Results</a></li>
-
         <ul class='biology submenu'>
+
         <li>
-
          <li><a href='/Team:ETH_Zurich/Biology/Journal' class='listmain'>Lab journal</a></li>
+
          <ul class='biologySub submenu'>
-
          <li><a href='/Team:ETH_Zurich/Biology/Safety' class='listmain'>Safety</a></li>
+
            <li><a href='/Team:ETH_Zurich/Biology/Cloning' class='listmain'>Material and Methods</a></li>
-
        </ul>
+
            <li><a href='/Team:ETH_Zurich/Biology/Journal' class='listmain'>Lab journal</a></li>
-
 
+
       
 +
          </ul>
 +
        </li>
       </ul>
       </ul>
-
       <ul class='modeling submenu'>
+
       <ul class='modelingSub submenu'>
-
         <li><a href='/Team:ETH_Zurich/Modeling' class='listmain'>Overview</a></li>
+
         <li><a href='/Team:ETH_Zurich/Modeling' class='listmain'>Overview</a></li>
         <li><a href='/Team:ETH_Zurich/Modeling/SingleCell'  class='listmain'>Single-Cell Model</a></li>
         <li><a href='/Team:ETH_Zurich/Modeling/SingleCell'  class='listmain'>Single-Cell Model</a></li>
-
         <li><a href='/Team:ETH_Zurich/Modeling/Microfluidics'  class='listmain'>Microfluidics Model</a></li>
+
        <li><a href='/Team:ETH_Zurich/Modeling/Analysis' class='listmain'>System Analysis</a></li>
-
         <li><a href='/Team:ETH_Zurich/Modeling/Combined'  class='listmain'>Combined Models</a></li>
+
         <li><a href='/Team:ETH_Zurich/Modeling/Microfluidics'  class='listmain'>Diffusion Model</a></li>
-
        <ul class='modeling submenu'>
+
         <li>
-
          <li><a href='/Team:ETH_Zurich/Modeling/Journal' class='listmain'>Modeling journal</a></li>
+
          <ul class='modelingSub submenu'>
-
        </ul>
+
            <li><a href='/Team:ETH_Zurich/Modeling/Combined'  class='listmain'>Combined Model</a></li>
 +
            <li><a href='/Team:ETH_Zurich/Modeling/Parameters' class='listmain'>Parameters</a></li>
 +
            <li><a href='/Team:ETH_Zurich/Modeling/References' class='listmain'>References</a></li>
 +
            <!--<li><a href='/Team:ETH_Zurich/Modeling/Code' class='listmain'>Code</a></li>-->
 +
            <li><a href='/Team:ETH_Zurich/Achievements/Model_Results' class='listmain'>Results</a></li>
 +
          </ul>
 +
        </li>
       </ul>
       </ul>
-
       <ul class='achievements submenu'>
+
       <ul class='processSub submenu'>
-
         <li><a href='/Team:ETH_Zurich/Achievements' class='listmain'>Overview</a></li>
+
         <li><a href='/Team:ETH_Zurich/Process/Microfluidics' class='listmain'>Channel Design</a></li>
-
         <li><a href='/Team:ETH_Zurich/Achievements/Results' class='listmain'>Experimental Results</a></li>
+
         <li><a href='/Team:ETH_Zurich/Process/Validation' class='listmain'>Evaluation</a></li>
-
         <li><a href='/Team:ETH_Zurich/Achievements/Data page' class='listmain'>Data page</a></li>
+
         <!--<li><a href='/Team:ETH_Zurich/Process/ModelVSExperiment' class='listmain'>Model VS Experiment</a></li>-->
-
         <li><a href='/Team:ETH_Zurich/Achievements/Model_Toolbox' class='listmain'>Model Toolbox</a></li>
+
      </ul>
 +
      <ul class='achievementsSub submenu'>
 +
         <li><a href='/Team:ETH_Zurich/Biology/Safety' class='listmain'>Safety</a></li>
 +
        <li><a href='/Team:ETH_Zurich/Team/Human practices' class='listmain'>Outreach</a></li>
 +
 
 +
        <li>
 +
          <ul class='achievementsSub submenu'>
 +
            <!--<li><a href='/Team:ETH_Zurich/Achievements/Model_Toolbox' class='listmain'>Model Toolbox</a></li>-->
 +
          </ul>
 +
        </li>
       </ul>
       </ul>
-
       <ul class='team submenu'>
+
       <ul class='teamSub submenu'>
-
         <li><a href='/Team:ETH_Zurich/Team/Media' class='listmain'>Media</a></li>
+
        <li><a href='/Team:ETH_Zurich/Team' class='listmain'>Overview</a></li>
-
         <li><a href='/Team:ETH_Zurich/Team/Acknowledgements' class='listmain'>Acknowledgments</a></li>
+
         <li><a href='/Team:ETH_Zurich/Team/Media' class='listmain'>Photo Gallery</a></li>
 +
         <li><a href='/Team:ETH_Zurich/Team/Acknowledgements' class='listmain'>Acknowledgements</a></li>
         <li><a href='/Team:ETH_Zurich/Team/Brainstorming' class='listmain'>Brainstorming</a></li>
         <li><a href='/Team:ETH_Zurich/Team/Brainstorming' class='listmain'>Brainstorming</a></li>
-
         <ul class='team submenu'>
+
         <li>
-
          <li><a href='https://igem.org/Team.cgi?year=2011&team_name=ETH_Zurich' class='listmain'>Official Team Overview</a></li>
+
          <ul class='teamSub submenu'>
-
        </ul>
+
            <li><a href='https://igem.org/Team.cgi?year=2011&team_name=ETH_Zurich' target='_blank' class='listmain'>Official Team Overview</a></li>
 +
            <li><a href='/Team:ETH_Zurich/Team/Sponsors' class='listmain'>Sponsors</a></li>
 +
         
 +
          </ul>
 +
        </li>
       </ul>
       </ul>
     </div>
     </div>
   </div>
   </div>
</div>
</div>
-
<script>
+
<script type="text/javascript">
         $('.submenu').css('display',  'none');
         $('.submenu').css('display',  'none');
-
var overlay = $("#overlay");
+
var overlay = $("#overlayBack");
function runIt() {
function runIt() {
Line 409: Line 225:
</html>
</html>
-
 
-
<html></html>
 
__NOTOC__
__NOTOC__

Latest revision as of 11:48, 13 October 2011

Menu image preload Menu image preload Menu image preload Menu image preload Menu image preload Menu image preload


Retrieved from "http://2011.igem.org/Team:ETH_Zurich/Templates/Header"