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> | ||
- | < | + | <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> | ||
- | < | + | <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> | ||
- | < | + | <script type="text/javascript"> |
- | + | $(function() { | |
- | + | $('ul.AccLavaNavigation').lavaLamp({ speed: 300, autoReturn: true , target:'li'}); | |
- | + | }); | |
- | + | $(function(){ | |
- | + | $('ul#accordionMenu').accordion({ | |
- | + | header:'.head', | |
- | + | fillSpace:false, | |
- | + | autoHeight:false, | |
- | + | navigation:true, | |
- | + | animated: 'easeslide'}) | |
- | + | }); | |
- | + | </script> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | #accordion | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | } | + | |
- | + | ||
- | + | ||
- | } | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | < | + | |
+ | <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> | ||
- | < | + | <li><a class="head" href="#">Project Firefly</a> |
- | < | + | <ul class="AccLavaNavigation"> |
- | < | + | <li><a href="/Team:Cambridge/Bioluminescence">Introduction</a></li> |
- | < | + | <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 class="head" href="#">Project Vibrio</a> | |
- | + | <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><a class="head" href="#">Considerations</a> | |
- | + | <ul class="AccLavaNavigation"> | |
- | + | <li><a href="/Team:Cambridge/Human_Practices">Human Practices</a></li> | |
- | + | <li><a href="/Team:Cambridge/Safety">Safety</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | <li><a class="head" href="#">Future applications</a> | |
- | </ | + | <ul class="AccLavaNavigation"> |
- | </ | + | <li><a href="/Team:Cambridge/Tools/microMeasure">Biosensors</a></li> |
- | < | + | <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> | ||
- | < | + | <li><a href="/Team:Cambridge/Partners" class="head">Our Partners</a> |
- | + | <ul class="AccLavaNavigation"> | |
- | < | + | <li><a href="/Team:Cambridge/Partners">Sponsors</a> </li> |
- | + | <li><a href="/Team:Cambridge/iGEM_Teams">iGEM Teams</a> </li> | |
- | + | <li><a href="/Team:Cambridge/Departments">University</a> </li> | |
- | + | <li><a href="/Team:Cambridge/Publicity">Publicity</a> </li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | </ul> | |
- | + | </div> | |
- | + | </div> | |
- | + | ||
- | < | + | |
- | + | ||
- | </ | + | |
- | |||
</html> | </html> |
Revision as of 19:14, 25 August 2013