Team:Tuebingen/Template/NavigationAccLava

From 2013.igem.org

(Difference between revisions)
Line 7: Line 7:
<link href='http://fonts.googleapis.com/css?family=Nunito:700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Nunito:700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
-
<title>Mainpage Team Tübingen</title>
+
<script type="text/javascript" src="http://igemtuebingen.coffeecup.com/iGEM_2013/jquery-menu.js"> </script>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
-
<style type="text/css">
+
<script type="text/javascript">
 +
(function(jQuery){jQuery.fn.lavaLamp=function(o){o=jQuery.extend({target:'li',fx:'swing',speed:500,click:function(){return true},startItem:'',autoReturn:true,returnDelay:0,setOnClick:true,homeTop:0,homeLeft:0,homeWidth:0,homeHeight:0,returnHome:false},o||{});return this.each(function(){if(jQuery(this).css('position')=='static')
 +
jQuery(this).css('position','relative');if(o.homeTop||o.homeLeft){var $home=jQuery('<'+o.target+' class="homeLava"></'+o.target+'>').css({left:o.homeLeft,top:o.homeTop,width:o.homeWidth,height:o.homeHeight,position:'absolute'});jQuery(this).prepend($home);}
 +
var path=location.pathname+location.search+location.hash,$selected,$back,$lt=jQuery(o.target+'[class!=noLava]',this),delayTimer,bx=by=0;$selected=jQuery(o.target+'.selectedLava',this);if(o.startItem!='')
 +
$selected=$lt.eq(o.startItem);if((o.homeTop||o.homeLeft)&&$selected.length<1)
 +
$selected=$home;if($selected.length<1){var pathmatch_len=0,$pathel;$lt.each(function(){var thishref=$('a:first',this).attr('href');if(path.indexOf(thishref)>-1&&thishref.length>pathmatch_len)
 +
{$pathel=$(this);pathmatch_len=thishref.length;}});if(pathmatch_len>0){$selected=$pathel;}}
 +
if($selected.length<1)
 +
$selected=$lt.eq(0);$selected=jQuery($selected.eq(0).addClass('selectedLava'));$lt.bind('mouseenter',function(){if(delayTimer){clearTimeout(delayTimer);delayTimer=null;}
 +
move(jQuery(this));}).click(function(e){if(o.setOnClick){$selected.removeClass('selectedLava');$selected=jQuery(this).addClass('selectedLava');}
 +
return o.click.apply(this,[e,this]);});$back=jQuery('<li class="backLava"><div class="leftLava"></div><div class="bottomLava"></div><div class="cornerLava"></div></li>').css('position','absolute').prependTo(this);bx=parseInt($back.css('borderLeftWidth').match(/\d+/))+parseInt($back.css('borderRightWidth').match(/\d+/))+parseInt($back.css('paddingLeft').match(/\d+/))+parseInt($back.css('paddingRight').match(/\d+/));by=parseInt($back.css('borderTopWidth').match(/\d+/))+parseInt($back.css('borderBottomWidth').match(/\d+/))+parseInt($back.css('paddingTop').match(/\d+/))+parseInt($back.css('paddingBottom').match(/\d+/));if(o.homeTop||o.homeLeft)
 +
$back.css({left:o.homeLeft,top:o.homeTop,width:o.homeWidth,height:o.homeHeight});else
 +
{$back.css({left:$selected.position().left,top:$selected.position().top,width:$selected.outerWidth()-bx,height:$selected.outerHeight()-by});}
 +
jQuery(this).bind('mouseleave',function(){var $returnEl=null;if(o.returnHome)
 +
$returnEl=$home;else if(!o.autoReturn)
 +
return true;if(o.returnDelay){if(delayTimer)clearTimeout(delayTimer);delayTimer=setTimeout(function(){move($returnEl);},o.returnDelay);}
 +
else{move($returnEl);}
 +
return true;});function move($el){if(!$el)$el=$selected;$back.stop()
 +
.animate({left:$el.position().left,top:$el.position().top,width:$el.outerWidth()-bx,height:$el.outerHeight()-by},o.speed,o.fx);};});};})(jQuery);
 +
</script>
-
<!-- Navigation -->
+
<script type="text/javascript">  
-
#navigation {
+
$(function() {
-
  margin-left: 0.5em;
+
$('ul.AccLavaNavigation').lavaLamp({ speed: 300, autoReturn: true , target:'li'});
-
  position: relative;
+
});
-
  top: 0.5em,
+
$(function(){
-
}
+
        $('ul#accordionMenu').accordion({
-
 
+
              header:'.head',
-
#accordion {
+
              fillSpace:false,
-
list-style: none;
+
              autoHeight:false,
-
padding: 1em 0.2em 1em 0.2em;
+
              navigation:true,
-
width: 170px;
+
              animated: 'easeslide'})
-
        font-size: 1.4em;
+
});
-
        color: white;
+
</script>
-
        font-family: 'Nunito', sans-serif;
+
-
        position: relative;
+
-
}
+
-
#accordion li{
+
-
display: block;
+
-
font-weight: bold;
+
-
margin: 1px;
+
-
cursor: pointer;
+
-
padding: 5 5 5 7px;
+
-
list-style: circle;
+
-
}
+
-
#accordion ul {
+
-
list-style: none;
+
-
padding: 0 0 0 0;
+
-
display: none;
+
-
}
+
-
#accordion ul li{
+
-
font-weight: normal;
+
-
cursor: auto;
+
-
background-color: transparent;
+
-
padding: 0 0 0 7px;
+
-
}
+
-
#accordion a {
+
-
text-decoration: none;
+
-
        font-weight: bold;
+
-
        color: white;
+
-
}
+
-
#accordion a:hover {
+
-
text-decoration: underline;
+
-
}
+
-
 
+
-
#navigation {
+
-
  background-color: #A51E37;
+
-
  width: 18em;
+
-
  height: 72.3em;
+
-
}
+
-
<!-- /Navigation-->
+
 +
<style type="text/css" style="display:none">
 +
#left{
 +
float:left;
 +
width:12em;
 +
padding:1em;
 +
background-color:grey;
 +
}
 +
#left ul{
 +
list-style:none;
 +
overflow:hidden;
 +
padding-left:0px;
 +
margin-left:10px;
 +
}
 +
#left ul li{
 +
margin-bottom:8px;
 +
position:relative;
 +
padding-top:4px;
 +
padding-bottom:0px;
 +
padding:none;
 +
font-family:Arial;
 +
}
 +
#left ul.AccLavaNavigation li{
 +
padding-left:10px;
 +
}
 +
#left ul li.backLava{
 +
background-color:white;
 +
height:23px;
 +
}
 +
#left ul.AccLavaNavigationgreen li{
 +
border-color:#96d446;
 +
}
 +
#left ul.AccLavaNavigationblue li{
 +
border-color:#386abc;
 +
}
 +
#left ul.AccLavaNavigationred li{
 +
border-color:#fb5c2b;
 +
}
 +
#left ul.AccLavaNavigationyellow li{
 +
border-color:#fad72a;
 +
}
 +
#left a{
 +
color: blue;
 +
font-size:15px;
 +
font-weight:bold;
 +
text-decoration:none;
 +
outline:none;
 +
display:block;
 +
width:200px;
 +
}
 +
#left a:hover{
 +
color:#181818;
 +
}
 +
#left a.hello{
 +
display:inline;
 +
}
</style>
</style>
-
 
</head>
</head>
 +
 +
<body>
 +
<div id="left">
 +
<ul id="accordionMenu">
 +
<li><a class="head" href="#"> Introduction</a>
 +
<ul class="AccLavaNavigation llmenublue">
 +
<li><a href="/Team:Cambridge">Home</a></li>
 +
<li><a href="/Team:Cambridge/TheTeam">Meet the Team</a></li>
 +
<li><a href="/Team:Cambridge/Photos">Photo Gallery</a></li>
 +
<li><a href="/Team:Cambridge/Videos">Videos</a></li>
 +
<li><a href="/Team:Cambridge/BioBricks">Parts submitted</a></li>
 +
</ul>
 +
</li>
-
<body>
+
<li><a class="head" href="#">Project Firefly</a>
-
<!-- Navigation -->
+
<ul class="AccLavaNavigation">
-
<div id="navigation">
+
<li><a href="/Team:Cambridge/Bioluminescence">Introduction</a></li>
-
<ul id="accordion">
+
<li><a href="/Team:Cambridge/Bioluminescence/Background_Firefly">Background</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Colour">Coloured outputs</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Luciferin_Regeneration">Luciferin recovery</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Firefly_Modelling">Modelling</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Firefly_Characterisation">Characterisation</a></li>
 +
</ul>
 +
</li>
-
    <li><a href="/Team:Tuebingen">Home</a></li>
+
<li><a class="head" href="#">Project Vibrio</a>
-
        <ul></ul>
+
<ul class="AccLavaNavigation">
 +
<li><a href="/Team:Cambridge/Bioluminescence/Bacterial_Luciferases">Introduction</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Background">Background</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/G28">The LuxBrick</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Bacterial_Codon_optimisation">Codon optimisation</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Vibrio_Modelling">Modelling</a></li>
 +
<li><a href="/Team:Cambridge/Bioluminescence/Vibrio_Characterisation">Characterisation</a></li>
 +
</ul>
 +
</li>
 +
 +
<li><a class="head" href="#">Tools</a>
 +
<ul class="AccLavaNavigation">
 +
<li><a href="/Team:Cambridge/Tools/Gibson">Gibthon</a></li>
 +
<li><a href="/Team:Cambridge/Tools/GenBank">BioBrick ? GenBank</a></li>
 +
<li><a href="/Team:Cambridge/Tools/Ligate">Ligation Calculator</a></li>
 +
<li><a href="/Team:Cambridge/Tools/Eglometer">The E.glometer</a></li>
 +
</ul>
 +
</li>
 +
 +
 +
<li><a class="head" href="#">Gibson Assembly</a>
 +
<ul class="AccLavaNavigation">
 +
<li><a href="/Team:Cambridge/Gibson/Introduction">Introduction</a></li>
 +
<li><a href="/Team:Cambridge/Gibson/Mechanism">How it works</a></li>
 +
<li><a href="/Team:Cambridge/Gibson/Protocol">Protocol</a></li>
 +
<li><a href="/Team:Cambridge/Gibson/RFC">RFC</a></li>
 +
</ul>
 +
</li>
-
    <li>Project</li>
+
<li><a class="head" href="#">Considerations</a>
-
        <ul>
+
<ul class="AccLavaNavigation">
-
            <li><a href="/Team:Tuebingen/Project/Overwiew">Overview</a></li>
+
<li><a href="/Team:Cambridge/Human_Practices">Human Practices</a></li>
-
            <li><a href="/Team:Tuebingen/Project/Motivation">Motivation</a></li>
+
<li><a href="/Team:Cambridge/Safety">Safety</a></li>
-
            <li><a href="/Team:Tuebingen/Project/Receptor">Receptor</a></li>
+
</ul>
-
            <li><a href="/Team:Tuebingen/Project/Inverter">Inverter</a></li>
+
</li>
-
            <li><a href="/Team:Tuebingen/Project/Reporter">Reporter</a></li>
+
-
    <li><a href="/Team:Tuebingen/Project/Appkication">Application</a></li>
+
-
    <li><a href="/Team:Tuebingen/Project/Safety">Safety</a></li>      
+
-
</ul>
+
-
   
+
-
    <li>Team</li>
+
-
        <ul>
+
-
            <li><a href="/Team:Tuebingen/Team/About">About Us</a></li>
+
-
            <li><a href="/Team:Tuebingen/Team/Attributions">Attributions</a></li>
+
-
            <li><a href="/Team:Tuebingen/Sponsors">Sponsors</a></li>
+
-
</ul>
+
-
+
-
    <li>Notebook</li>
+
-
        <ul>
+
-
            <li><a href="/Team:Tuebingen/Notebook/Protocols">Protocols</a></li>
+
-
            <li><a href="/Team:Tuebingen/Notebook/Journal">Weekly Journal</a></li>
+
-
        </ul>
+
-
+
-
    <li>Activities</li>
+
-
<ul>
+
-
            <li><a href="/Team:Tuebingen/Activities/SynBio">SynBio-Day</a></li>
+
-
            <li><a href="/Team:Tuebingen/Activities/School">School-Project</a></li>
+
-
            <li><a href="/Team:Tuebingen/Activities/Videogame">Videogame</a></li>
+
-
        </ul>
+
-
+
-
  <li>Results</li> 
+
-
<ul>
+
-
    <li><a href="/Team:Tuebingen/Results/Modelling">Modelling</a></li>
+
-
            <li><a href="/Team:Tuebingen/Results/Overview">Overview</a></li>
+
-
            <li><a href="/Team:Tuebingen/Results/Receptor">Receptor</a></li>
+
-
            <li><a href="/Team:Tuebingen/Results/Inverter">Inverter</a></li>
+
-
    <li><a href="/Team:Tuebingen/Results/Reporter">Reporter</a></li>
+
-
            <li><a href="/Team:Tuebingen/Results/ShippedParts">Shipped Parts</a></li>
+
-
        </ul>
+
-
  <li><a href="/Team:Tuebingen/Contact">Contact Us</a></li>
+
<li><a class="head" href="#">Future applications</a>
-
</ul>
+
<ul class="AccLavaNavigation">
-
</div>
+
<li><a href="/Team:Cambridge/Tools/microMeasure">Biosensors</a></li>
-
<!-- /Navigation -->
+
<li><a href="/Team:Cambridge/Tools/Lighting">Lighting</a></li>
 +
</ul>
 +
</li>
 +
<li><a class="head" href="/Team:Cambridge/Notebook/Week1">Notebook</a>
 +
<ul class="AccLavaNavigation">
 +
<li><a href="/Team:Cambridge/Notebook/Summary">Summary</a></li>
 +
<li><a href="/Team:Cambridge/Notebook/Week1">Week 1</a></li>
 +
<li><a href="/Team:Cambridge/Notebook/Week2">Week 2</a></li>
 +
<li><a href="/Team:Cambridge/Notebook/Week3">Week 3</a></li>
 +
<li><a href="/Team:Cambridge/Notebook/FurtherWork">Beyond Week 12</a></li>
 +
<li><a href="/Team:Cambridge/Protocols">Protocols</a> </li>
 +
</ul>
 +
</li>
-
<script>
+
<li><a href="/Team:Cambridge/Partners" class="head">Our Partners</a>
-
 
+
<ul class="AccLavaNavigation">
-
<!-- Navigation -->
+
<li><a href="/Team:Cambridge/Partners">Sponsors</a> </li>
-
$("#accordion > li").click(function(){
+
<li><a href="/Team:Cambridge/iGEM_Teams">iGEM Teams</a> </li>
-
 
+
<li><a href="/Team:Cambridge/Departments">University</a> </li>
-
if(false == $(this).next().is(':visible')) {
+
<li><a href="/Team:Cambridge/Publicity">Publicity</a> </li>
-
$('#accordion > ul').slideUp(300);
+
</ul>
-
}
+
</li>
-
$(this).next().slideToggle(300);
+
</ul>
-
});
+
</div>  
-
 
+
</div>
-
$('#accordion ul:eq(1)').show();
+
-
<!-- /Navigation -->
+
-
 
+
-
</script>
+
-
</body>
 
</html>
</html>

Revision as of 19:14, 25 August 2013