Team:DTU-Denmark/gogo

From 2013.igem.org

Sexy Drop Down Menu with CSS & jQuery - Tutorial by Soh Tanaka - SohTanaka.com

   <link rel="stylesheet" href="https://2013.igem.org/Team:DTU-Denmark/stylesheet?action=raw&ctype=text/css" type="text/css" />
  <link rel="icon" type="image/png" size="16x16" href="DTU-n2o-favicon.png"/>   
 


   <script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
   <script>
       $(function() {
       // initialize scrollable
       $(".scrollable").scrollable().navigator();
       });
   </script>
   <script type="text/javascript">
       var prevScrollPos = -1000;
       $(window).scroll(function () {
            
           var scrollPos = Math.floor($(window).scrollTop());
           if(Math.abs(prevScrollPos - scrollPos) <= 1){
                 return "nuthin";
           }
 
           var toc_margin_from_top = $(".navigation").height() + 35;
           var scroll_pos_above_start_of_article = scrollPos < $(".whitebox.article").offset().top - 68;
           var toc_end_reached_bottom_of_article = scrollPos + toc_margin_from_top + $(".toc").height() > $(".whitebox.article").offset().top + $(".whitebox.article").height() - 35;
           var toc_margin_from_title = scrollPos < ($(".whitebox.article").offset().top );
           


           if(scroll_pos_above_start_of_article){
                  $(".toc").offset({top: $(".whitebox.article").offset().top + 68});
           } else if(toc_end_reached_bottom_of_article){
                  $(".toc").offset({top: $(".whitebox.article").offset().top + $(".whitebox.article").height() - $(".toc").height() - 35});
           } else if(toc_margin_from_title){
                  $(".toc").offset({top: $(".whitebox.article").offset().top + 68});
           } else {
                  $(".toc").offset({top: scrollPos + toc_margin_from_top});
           }
           var scroll_pos_above_menubar = scrollPos < 250;
           if(scroll_pos_above_menubar){
                  $(".navigation").offset({top: 250 });
           } else {
                  $(".navigation").offset({top: scrollPos});
           }
           //if (scroll_pos_below_start_of_article){ //&& (scrollPos < $(document).height() - $(".navigation")[0].height() - 70)) {
           //    $(".toc").addClass("stickBelowNavigation");
           //} else {
           //   $(".toc").removeClass("stickBelowNavigation");
           //}
       });
   </script>
   <script type="text/x-mathjax-config">
       MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
       MathJax.Hub.Config({
           TeX: { 
               equationNumbers: {  autoNumber: "AMS"  }
           }
       });
   </script>
   <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
   <script type="text/javascript">
       $(document).ready(
           function(){
               $("ul.subnav").parent().find("> a").append("");
               $("ul.topnav li").hover(
                   function() {
                       // Hover over
                       $(this).parent().find("ul.subnav").hide();
                       $(this).find("ul.subnav").show();
                       // Hover out
                       $(this).hover(
                           function() {
                           },
                           function(){
                               $(this).find("ul.subnav").hide();
                           }
                       );
                   },
                   function(){
                       $(this).find("ul.subnav").hide();
                   }
               );
           }
       );
   </script>
       <script type="text/javascript">
           $(document).ready(function() {
               $("p").filter( function() {
                   return $.trim($(this).html()) == ;
               }).remove();
           });
       </script>
       <script type="text/javascript">
           $(document).ready(function() {
               $("menubar > ul > li:last-child").remove();
           });
       </script>
       <script type="text/javascript">
           $(document).ready(function() {
               if ("" == "</html>{{{1}}}") {
                    $("#heading").remove();
                }
            });
        




    

    

    
    





    
    

{{{1}}}