Difference between revisions of "Template:Freiburg/Menubar"

(New navigation with dropdown submenu)
 
(113 intermediate revisions by 3 users not shown)
Line 4: Line 4:
 
         <title>""</title>
 
         <title>""</title>
 
         <meta charset="utf-8">
 
         <meta charset="utf-8">
−
 
+
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
         <style>
 
         <style>
 
/* ============= BEGIN: Stylesheet for navigation menu ============= */
 
/* ============= BEGIN: Stylesheet for navigation menu ============= */
  
−
/*Stylesheet for Navigation Bar*/
+
/* ==== Begin General Settings ====*/
−
 
+
−
/* Begin General Settings */
+
 
body {
 
body {
 
     margin: 0px;
 
     margin: 0px;
Line 16: Line 14:
  
 
#header {
 
#header {
−
    height: 113px;
+
position: fixed;
−
     /*background-color: aquamarine;*/
+
width: 100%;
 +
margin-top: 0px;
 +
     z-index: 600;
 
}
 
}
−
/* End General Settings */
+
/* ==== End General Settings ==== */
  
 +
@media screen and (min-width: 911px){
  
 
#naviconwrapper {
 
#naviconwrapper {
Line 29: Line 30:
 
     padding-top: 16px;
 
     padding-top: 16px;
 
     z-index: -100;
 
     z-index: -100;
−
    border: 2px solid #008631;
 
 
}
 
}
  
Line 48: Line 48:
 
      
 
      
  
−
/*Begin Settings Main Menu Icons*/
+
/* ==== Begin Settings Main Menu Icons ==== */
 
#navicons {
 
#navicons {
 
     margin: 0px auto;
 
     margin: 0px auto;
Line 85: Line 85:
 
     display: block;
 
     display: block;
 
     text-decoration: none;
 
     text-decoration: none;
−
     color: #FFF;
+
     /*color: #FFF;*/
 
     text-align: center;
 
     text-align: center;
 
     text-transform: uppercase;
 
     text-transform: uppercase;
Line 92: Line 92:
  
 
#navicons ul a:hover {  
 
#navicons ul a:hover {  
−
    ;
 
 
}     
 
}     
−
/*End Settings Main Menu Icons*/
+
/* ==== End Settings Main Menu Icons ==== */
 
    
 
    
  
−
/* classes for icons */
+
/* ==== classes for icons ==== */
 
#home {
 
#home {
 
     background: url(https://static.igem.org/mediawiki/2015/8/81/Freiburg_icon_home.png) no-repeat;  
 
     background: url(https://static.igem.org/mediawiki/2015/8/81/Freiburg_icon_home.png) no-repeat;  
 
     height: 60px;;
 
     height: 60px;;
 
     background-position: center;
 
     background-position: center;
 +
}
 +
 +
#home a {
 +
    color: #FFF;
 
}
 
}
  
Line 109: Line 112:
 
     background-position: center;
 
     background-position: center;
 
}
 
}
 +
 +
#project a {
 +
    color: #FFF;
 +
}
 +
 
#team {
 
#team {
 
     background: url(https://static.igem.org/mediawiki/2015/3/38/Freiburg_icon_team.png) no-repeat;  
 
     background: url(https://static.igem.org/mediawiki/2015/3/38/Freiburg_icon_team.png) no-repeat;  
Line 114: Line 122:
 
     background-position: center;
 
     background-position: center;
 
}
 
}
 +
 +
#team a {
 +
    color: #FFF;
 +
}
 +
 
#results {
 
#results {
 
     background: url(https://static.igem.org/mediawiki/2015/2/2d/Freiburg_icon_results.png) no-repeat;  
 
     background: url(https://static.igem.org/mediawiki/2015/2/2d/Freiburg_icon_results.png) no-repeat;  
 
     height: 60px;
 
     height: 60px;
 
     background-position: center;
 
     background-position: center;
 +
}
 +
 +
#results a {
 +
    color: #FFF;
 
}
 
}
  
Line 124: Line 141:
 
     height: 60px;
 
     height: 60px;
 
     background-position: center;
 
     background-position: center;
 +
}
 +
 +
#policy a {
 +
    color: #FFF;
 
}
 
}
  
Line 131: Line 152:
 
     background-position: center;
 
     background-position: center;
 
}
 
}
−
/* End classes for icons */
 
  
 +
#notebook a {
 +
    color: #FFF;
 +
}
 +
/* ==== End classes for icons ==== */
  
−
/*Begin running chip */
+
/* ==== Begin running chip ==== */
−
/*Begin Chip Design*/
+
/* == Begin Chip Design == */
 
#runningchip {
 
#runningchip {
 
     position: absolute;
 
     position: absolute;
Line 233: Line 257:
 
   left:50%;
 
   left:50%;
 
}
 
}
−
/*End Chip Design*/
+
/* == End Chip Design == */
  
  
−
/*Begin Chip Movement*/
+
/* == Begin Chip Movement == */
 
#home:hover ~ #runningchip {
 
#home:hover ~ #runningchip {
 
     left: 2.1%;
 
     left: 2.1%;
Line 260: Line 284:
 
     left: 85.5%;
 
     left: 85.5%;
 
}
 
}
−
/*End Chip Movment*/
+
/* == End Chip Movment == */
−
/*End running chip*/
+
/* ==== End running chip ==== */
  
  
−
/*Begin Settings Submenu Level 1*/
+
/* ==== Begin Settings Submenu Level 1 ==== */
 
#navtextwrapper {                /*define background box*/
 
#navtextwrapper {                /*define background box*/
 
     margin: 0 auto;
 
     margin: 0 auto;
Line 279: Line 303:
 
     font-family: Roboto,sans-serif;
 
     font-family: Roboto,sans-serif;
 
     font-size: 16px;
 
     font-size: 16px;
 +
    z-index: 600;
 
}
 
}
  
 
#navtext ul {
 
#navtext ul {
 
     margin: 0px auto;
 
     margin: 0px auto;
 +
    top: -8px;
 
     padding: 0px;
 
     padding: 0px;
 
     position: absolute;
 
     position: absolute;
 +
    z-index: 600;
 
}
 
}
  
 
#navtext li {
 
#navtext li {
 
     margin: 0px auto;        /*centers text*/
 
     margin: 0px auto;        /*centers text*/
−
    width: 120px;
 
 
     list-style: none;
 
     list-style: none;
 
     display: block;        /*makes items go horizontal and centers them*/
 
     display: block;        /*makes items go horizontal and centers them*/
 
     /*float: left;*/                /*makes items go horizontal*/
 
     /*float: left;*/                /*makes items go horizontal*/
 
     position: relative;
 
     position: relative;
 +
    z-index: 600;
 
}     
 
}     
  
Line 299: Line 326:
 
     margin-top: 2px;
 
     margin-top: 2px;
 
     height: 24px;
 
     height: 24px;
−
     width: 120px;
+
     padding-left: 10px;
 +
    padding-right: 10px;
 
     text-decoration: none;
 
     text-decoration: none;
 
     color: #FFF;
 
     color: #FFF;
Line 305: Line 333:
 
     text-align: center;
 
     text-align: center;
 
     border-radius: 8px;
 
     border-radius: 8px;
 +
    z-index: 600;
 
}
 
}
  
Line 314: Line 343:
 
#project-sub {
 
#project-sub {
 
     display: none;
 
     display: none;
−
     left: 220px;
+
     left: 22.1%;
 
}
 
}
  
Line 320: Line 349:
 
     /*background-color: #ac34fe;*/
 
     /*background-color: #ac34fe;*/
 
     display: none;
 
     display: none;
−
     left: 340px;
+
     left: 35.2%;
 
}
 
}
  
 
#results-sub{
 
#results-sub{
 
     display: none;
 
     display: none;
−
     left: 460px;
+
     left: 49.4%;
 
}
 
}
  
 
#policy-sub{
 
#policy-sub{
 
     display: none;
 
     display: none;
−
     left: 582px;
+
     left: 62.8%;
 
}
 
}
  
 
#notebook-sub{
 
#notebook-sub{
 
     display: none;
 
     display: none;
−
     left: 704px;
+
     left: 76%;
 +
    width: 120px;
 
}
 
}
  
Line 343: Line 373:
  
 
.navsub1 {
 
.navsub1 {
 +
    background-color: #1962AB;
 +
opacity: 1;
 +
} 
 +
/* ==== End Settings Submenu Level 1 ==== */
 +
 +
 +
/* ==== Begin Settings Submenu Level 2 ==== */
 +
#navtext ul ul {
 +
    position: absolute;
 +
    width: 130%;
 +
    display: none;
 +
    left: 100%;              /* subsubmenu always touches its parent element jb */
 +
    top: -2px;
 +
}
 +
 +
#navtext ul  ul li {
 +
    margin: 0px auto;        /*centers text*/
 +
    list-style: none;
 +
    /*display: block; */      /*makes items go horizontal and centers them*/
 +
    /*float: left;*/              /*makes items go horizontal*/
 +
    position: relative;
 +
}   
 +
 +
#navtext ul  ul li a {
 +
    height: 24px;
 +
    padding-left: 10px;
 +
    padding-right: 10px;
 +
    text-decoration: none;
 +
    color: #FFF;
 +
    /*display: block;*/
 +
    text-align: center;
 +
}
 +
 +
#navtext ul li:hover ul {
 +
    display: block;
 +
}
 +
 +
.navsub2 {
 +
    background-color: #1962AB;
 +
    opacity: 1;
 +
}
 +
 +
.navsub2before {
 +
    background-color: #1962AB;
 +
    border-top-right-radius: 8px;
 +
    opacity: 0.6;
 +
}
 +
 +
.navsub2after {
 
     background-color: #0051A2;
 
     background-color: #0051A2;
 +
    border-bottom-right-radius: 8px;
 +
    border-bottom-left-radius: 8px;
 +
    opacity: 0.6;
 
}
 
}
−
   
 
−
/*End Settings Submenu Level 1*/
 
  
−
/* ============= BEGIN: Stylesheet for navigation menu ============= */
+
.subsubmenu{
−
    </style>
+
background-image: url("https://static.igem.org/mediawiki/2015/f/ff/Freiburg_submenu_arrow.png");
 +
background-repeat: no-repeat;
 +
background-position: 95% 50%;
 +
background-size: 10px 13px;
 +
}
  
 +
/* ==== End Settings Submenu Level 2 ==== */
  
−
<!------------- BEGIN: jQuery ------------->
+
#smallnav{
−
         <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+
    display: none;
−
        <script type="text/javascript">
+
}
−
             $(function() {
+
 
−
                $("document").ready(function(){
+
} /* end media query*/
 +
 
 +
@media screen and (max-width: 910px){
 +
    #header{
 +
        top: -9000px;
 +
        opacity: 0;
 +
    }
 +
 
 +
/* avoid space to content box */
 +
    .content_background_wrapper{
 +
        padding-top: 20px;
 +
    }
 +
 
 +
}
 +
 
 +
/* Styles for smallnav */
 +
 
 +
/* Clearfix */
 +
.clearfix:before,
 +
.clearfix:after {
 +
    content: " ";
 +
    display: table;
 +
}
 +
.clearfix:after {
 +
    clear: both;
 +
}
 +
.clearfix {
 +
    *zoom: 1;
 +
}
 +
 
 +
 
 +
/* Basic Styles */
 +
 
 +
#smallnav {
 +
    height: 40px;
 +
    width: 100%;
 +
    background: #0051A2;
 +
    font-size: 11pt;
 +
    font-family: 'PT Sans', Arial, sans-serif;
 +
    font-weight: bold;
 +
    position: fixed;
 +
    border-bottom: 2px solid #CFCFCF;
 +
    z-index: 3000;
 +
    opacity: 0.9;
 +
}
 +
#smallnav ul {
 +
    padding: 0;
 +
    margin: 0 auto;
 +
    width: 720px;
 +
    height: 40px;
 +
}
 +
#smallnav li {
 +
    display: inline;
 +
    float: left;
 +
}
 +
#smallnav a {
 +
    color: #fff;
 +
    display: inline-block;
 +
    width: 120px;
 +
    text-align: center;
 +
    text-decoration: none;
 +
    line-height: 40px;
 +
}
 +
#smallnav li a {
 +
    box-sizing:border-box;
 +
    -moz-box-sizing:border-box;
 +
    -webkit-box-sizing:border-box;
 +
}
 +
#smallnav li:last-child a {
 +
    border-right: 0;
 +
}
 +
#smallnav a:hover, #smallnav a:active {
 +
    background-color: #1D629F;
 +
}
 +
#smallnav a#pull {
 +
    display: none;
 +
}
 +
 
 +
/*Styles for screen 600px and lower*/
 +
@media screen and (max-width: 720px) {
 +
    #smallnav {
 +
        height: auto;
 +
        background: #3B7EBF;
 +
    }
 +
    #smallnav ul {
 +
        width: 100%;
 +
        display: block;
 +
        height: auto;
 +
    }
 +
    #smallnav li {
 +
        width: 50%;
 +
        float: left;
 +
        position: relative;
 +
        margin-bottom: 0;
 +
    }
 +
 
 +
    #smallnav a {
 +
         text-align: left;
 +
        width: 100%;
 +
        text-indent: 25px;
 +
    }
 +
 
 +
    #smallnav {
 +
        border-bottom: 0;
 +
    }
 +
    #smallnav ul {
 +
        display: none;
 +
        height: auto;
 +
    }
 +
    #smallnav a#pull {
 +
        display: block;
 +
        background-color: #0051A2;
 +
        width: 100%;
 +
        position: relative;
 +
    }
 +
    #smallnav a#pull:after {
 +
        content:"";
 +
        background: url('https://static.igem.org/mediawiki/2015/e/e0/Freiburg_menu_button_white.png') no-repeat;
 +
        background-size: auto 90%;
 +
        width: 30px;
 +
        height: 30px;
 +
        display: inline-block;
 +
        position: absolute;
 +
        right: 15px;
 +
        top: 5px;
 +
    }
 +
 
 +
 
 +
/* ==== classes for icons ==== */
 +
#home_small {
 +
    background-color: #3673AF;
 +
 
 +
}
 +
 
 +
#home_small a {
 +
    background: url(https://static.igem.org/mediawiki/2015/1/15/Freiburg_icon_home_white_03.png) no-repeat;
 +
    background-position: left;
 +
    background-size: auto 100%;
 +
    background-repeat: no-repeat;
 +
    padding-left: 40px;
 +
    color: #FFF;
 +
}
 +
 
 +
#project_small {
 +
    background-color: #3673AF;
 +
 
 +
}
 +
 
 +
#project_small a {
 +
    background: url(https://static.igem.org/mediawiki/2015/7/76/Freiburg_icon_project_white_03.png) no-repeat;
 +
    background-position: left;
 +
    background-size: auto 90%;
 +
    background-repeat: no-repeat;
 +
    padding-left: 40px;
 +
    color: #FFF;
 +
}
 +
 
 +
#team_small {
 +
    background-color: #3673AF;
 +
 
 +
}
 +
 
 +
#team_small a {
 +
    background: url(https://static.igem.org/mediawiki/2015/4/42/Freiburg_icon_team_white_03.png) no-repeat;
 +
    background-position: left;
 +
    background-size: auto 90%;
 +
    background-repeat: no-repeat;
 +
    padding-left: 40px;
 +
    color: #FFF;
 +
}
 +
 
 +
#results_small {
 +
    background-color: #3673AF;
 +
 
 +
}
 +
 
 +
#results_small a {
 +
    background: url(https://static.igem.org/mediawiki/2015/1/1e/Freiburg_icon_results_white_03.png) no-repeat;
 +
    background-position: left;
 +
    background-size: auto 90%;
 +
    background-repeat: no-repeat;
 +
    padding-left: 40px;
 +
    color: #FFF;
 +
}
 +
 
 +
#policy_small {
 +
    background-color: #3673AF;
 +
}
 +
 
 +
#policy_small a {
 +
    color: #FFF;
 +
    padding-left: 40px;
 +
    background-image: url(https://static.igem.org/mediawiki/2015/f/f9/Freiburg_icon_policy_white_03.png);
 +
    background-position: left;
 +
    background-size: auto 90%;
 +
    background-repeat: no-repeat;
 +
}
 +
 
 +
#notebook_small {
 +
    background-color: #3673AF;
 +
}
 +
 
 +
#notebook_small a {
 +
    background: url(https://static.igem.org/mediawiki/2015/9/99/Freibur_icon_notebook_white_03.png) no-repeat;
 +
    background-position: left;
 +
    background-size: auto 90%;
 +
    background-repeat: no-repeat;
 +
    padding-left: 40px;
 +
    color: #FFF;
 +
}
 +
/* ==== End classes for icons ==== */
 +
 
 +
 
 +
}/* end media query
 +
 
 +
/*Smartphone*/
 +
@media only screen and (max-width : 320px) {
 +
    #smallnav li {
 +
        display: block;
 +
        float: none;
 +
        width: 100%;
 +
    }
 +
}
 +
 
 +
 
 +
</style>
 +
 
 +
 
 +
<!-- BEGIN: jQuery -->
 +
 
 +
 
 +
<script>
 +
// FOR SMALLNAV
 +
    $(function() {
 +
        var pull        = $('#pull');
 +
             menu        = $('#smallnav ul');
 +
            menuHeight  = menu.height();
 +
 
 +
        $(pull).on('click', function(e) {
 +
            e.preventDefault();
 +
            menu.slideToggle();
 +
        });
 +
 
 +
        $(window).resize(function(){
 +
            var w = $(window).width();
 +
            if(w > 320) {
 +
                if (menu.is(':hidden')) {
 +
                menu.removeAttr('style');
 +
                }
 +
            }
 +
        });
 +
    });
 +
</script>
 +
 
 +
<script type="text/javascript">
 +
        $(document).ready(function(){
 
// make submenus appear //
 
// make submenus appear //
−
                    $("#home").hover(function(){
+
            $("#home").hover(function(){
−
                        $("#team-sub") .hide();
+
                $("#team-sub") .hide();
−
                        $("#project-sub") .hide();
+
                $("#project-sub") .hide();
−
                        $("#results-sub") .hide();
+
                $("#results-sub") .hide();
−
                        $("#policy-sub") .hide();
+
                $("#policy-sub") .hide();
−
                        $("#notebook-sub") .hide();
+
                $("#notebook-sub") .hide();
−
                    });
+
            });
−
                    $("#project").hover(function(){  
+
            $("#project").hover(function(){  
−
                        $("#project-sub") .show();
+
                $("#project-sub") .show();
−
                        $("#team-sub") .hide();
+
                $("#team-sub") .hide();
−
                        $("#results-sub") .hide();
+
                $("#results-sub") .hide();
−
                        $("#policy-sub") .hide();
+
                $("#policy-sub") .hide();
−
                        $("#notebook-sub") .hide();
+
                $("#notebook-sub") .hide();
−
                    });
+
            },
−
                   
+
                                    function(){
−
                    $("#team").hover(function(){
+
                $("#project-sub") .hide();
−
                        $("#team-sub") .show();
+
            });
−
                        $("#project-sub") .hide();
+
           
−
                        $("#results-sub") .hide();
+
            $("#team").hover(function(){
−
                        $("#policy-sub") .hide();
+
                $("#team-sub") .show();
−
                        $("#notebook-sub") .hide();
+
                $("#project-sub") .hide();
−
                    });
+
                $("#results-sub") .hide();
−
                   
+
                $("#policy-sub") .hide();
−
                    $("#results").hover(function(){
+
                $("#notebook-sub") .hide();
−
                        $("#results-sub") .show();
+
            },
−
                        $("#project-sub") .hide();
+
                                    function(){
−
                        $("#team-sub") .hide();
+
                $("#team-sub") .hide();
−
                        $("#policy-sub") .hide();
+
            });
−
                        $("#notebook-sub") .hide();
+
           
−
                    });
+
            $("#results").hover(function(){
−
                   
+
                $("#results-sub") .show();
−
                    $("#policy").hover(function(){
+
                $("#project-sub") .hide();
−
                        $("#policy-sub") .show();
+
                $("#team-sub") .hide();
−
                        $("#project-sub") .hide();
+
                $("#policy-sub") .hide();
−
                        $("#team-sub") .hide();
+
                $("#notebook-sub") .hide();
−
                        $("#results-sub") .hide();
+
            });
−
                        $("#notebook-sub") .hide();
+
           
−
                    });
+
            $("#policy").hover(function(){
−
                   
+
                $("#policy-sub") .show();
−
                    $("#notebook").hover(function(){
+
                $("#project-sub") .hide();
−
                        $("#notebook-sub") .show();
+
                $("#team-sub") .hide();
−
                        $("#project-sub") .hide();
+
                $("#results-sub") .hide();
−
                        $("#team-sub") .hide();
+
                $("#notebook-sub") .hide();
−
                        $("#results-sub") .hide();
+
            },
−
                        $("#policy-sub") .hide();
+
                                    function(){
−
                    });
+
                $("#policy-sub") .hide();
 +
            });
 +
           
 +
            $("#notebook").hover(function(){
 +
                $("#notebook-sub") .show();
 +
                $("#project-sub") .hide();
 +
                $("#team-sub") .hide();
 +
                $("#results-sub") .hide();
 +
                $("#policy-sub") .hide();
 +
            },
 +
                                    function(){
 +
                $("#notebook-sub") .hide();
 +
            });
 
// make chip stay over main menu point when its submenu appears and makes the submenu stay visible//
 
// make chip stay over main menu point when its submenu appears and makes the submenu stay visible//
−
                    $("#project-sub") .hover(function(){
+
            $("#project-sub") .hover(function(){
−
                        $("#runningchip") .css('left','18.6%');
+
                $("#runningchip") .css('left','18.6%');
−
                        $("#project-sub") .show();
+
                $("#project-sub") .show();
−
                    },
+
            },
−
                                            function(){
+
                                    function(){
−
                        $("#runningchip") .css('left','');
+
                $("#runningchip") .css('left','');
−
                        $("#project-sub") .hide();
+
                $("#project-sub") .hide();
−
                    });
+
            });
−
                    $("#team-sub") .hover(function(){
+
            $("#team-sub") .hover(function(){
−
                        $("#runningchip") .css('left','35.5%');
+
                $("#runningchip") .css('left','35.5%');
−
                        $("#team-sub") .show();
+
                $("#team-sub") .show();
−
                    },
+
            },
−
                                            function(){
+
                                    function(){
−
                        $("#runningchip") .css('left','');
+
                $("#runningchip") .css('left','');
−
                        $("#team-sub") .hide();
+
                $("#team-sub") .hide();
−
                    });
+
            });
−
                    $("#results-sub") .hover(function(){
+
            $("#results-sub") .hover(function(){
−
                        $("#runningchip") .css('left','52%');
+
                $("#runningchip") .css('left','52%');
−
                        $("#results-sub") .show();
+
                $("#results-sub") .show();
−
                    },
+
            },
−
                                            function(){
+
                                    function(){
−
                        $("#runningchip") .css('left','');
+
                $("#runningchip") .css('left','');
−
                        $("#results-sub") .hide();
+
                $("#results-sub") .hide();
−
                    });
+
            });
−
                    $("#policy-sub") .hover(function(){
+
            $("#policy-sub") .hover(function(){
−
                        $("#runningchip") .css('left','68.9%');
+
                $("#runningchip") .css('left','68.9%');
−
                        $("#policy-sub") .show();
+
                $("#policy-sub") .show();
−
                    },
+
            },
−
                                            function(){
+
                                    function(){
−
                        $("#runningchip") .css('left','');
+
                $("#runningchip") .css('left','');
−
                        $("#policy-sub") .hide();
+
                $("#policy-sub") .hide();
−
                    });
+
            });
−
                    $("#notebook-sub") .hover(function(){
+
            $("#notebook-sub") .hover(function(){
−
                        $("#runningchip") .css('left','85.5%');
+
                $("#runningchip") .css('left','85.5%');
−
                        $("#notebook-sub") .show();
+
                $("#notebook-sub") .show();
−
                    },
+
            },
−
                                            function(){
+
                                    function(){
−
                        $("#runningchip") .css('left','');
+
                $("#runningchip") .css('left','');
−
                        $("#notebook-sub") .hide();
+
                $("#notebook-sub") .hide();
−
                    });
+
            });
−
                });
+
        });
−
            })
+
</script>
−
        </script>
+
  
−
<!------------- END: jQuery ------------->
 
  
−
    </head>
+
<script>
 +
        /*Attachable menu code*/
 +
        $( document ).ready(function() {
 +
       
 +
            $(window).scroll(function (event) {
 +
                var y = $(this).scrollTop();
 +
                if(y>60){
  
 +
                    $("#header").css('position','fixed');
 +
                    $("#header").css('width','100%');
 +
                    $("#header").css('margin-top','-61px');
 +
                    $("#bottom-arrow").css('display','none');
 +
                    $("#runningchip-back").css('display','none');
 +
                    $("#navtext").css('margin-top','-20px');
 +
                    $(".chip_gap").css('height','30px');
 +
 +
                }else{
 +
                    var offsetTop = -y;
 +
                    $("#header").css('margin-top',offsetTop+'px');
 +
                    $("#bottom-arrow").removeAttr('style');
 +
                    $("#runningchip-back").removeAttr('style');
 +
                    $("#navtext").removeAttr('style');
 +
                    $(".chip_gap").css('height','23px');
 +
                }
 +
 +
            });
 +
/*Fix for when a link targets an id -> check the position on pageload*/
 +
$(window).scroll();
 +
 +
        });
 +
 +
</script>
 +
 +
<!-- END: jQuery -->
 +
 +
 +
</head>
 +
 +
 +
<!-- BEGIN: Body content -->
 +
<body>
 +
 +
<!-- BEGIN: Normal Menubar -->
  
−
<!------------- BEGIN: Body content =------------->
 
−
    <body>
 
 
       <div id="header">
 
       <div id="header">
 
<!-- Begin navigation menu icons -->
 
<!-- Begin navigation menu icons -->
Line 462: Line 851:
 
                 <div id="navicons"> <!-- only icons -->
 
                 <div id="navicons"> <!-- only icons -->
 
                     <ul>
 
                     <ul>
−
                         <li id="home" ><a href="#">Home</a>
+
                         <li id="home" ><a href="https://2015.igem.org/Team:Freiburg/Home">Home</a>
 
                         </li>
 
                         </li>
−
                         <li id="project"><a href="#">Project</a>
+
                         <li id="project"><a href="https://2015.igem.org/Team:Freiburg/Project/Overview">Project</a>
 
                         </li>
 
                         </li>
−
                         <li id="team"><a href="#">Team</a>
+
                         <li id="team"><a href="https://2015.igem.org/Team:Freiburg/Team">Team</a>
 
                         </li>
 
                         </li>
−
                         <li id="results"><a href="#">Results</a>
+
                         <li id="results"><a href="https://2015.igem.org/Team:Freiburg/Results">Results</a>
 
                         </li>
 
                         </li>
−
                         <li id="policy" style="font-size:11px"><a href="#">Human Practice</a>
+
                         <li id="policy" style="font-size:11px"><a href="https://2015.igem.org/Team:Freiburg/Practices">Human Practice</a>
 
                         </li>
 
                         </li>
−
                         <li id="notebook"><a href="#">Notebook</a>
+
                         <li id="notebook"><a href="https://2015.igem.org/Team:Freiburg/Notebook">Notebook</a>
 
                         </li>
 
                         </li>
 
                     <div id="runningchip">
 
                     <div id="runningchip">
Line 490: Line 879:
 
                 <div id="navtext">
 
                 <div id="navtext">
 
                     <ul id="project-sub">
 
                     <ul id="project-sub">
−
                         <li class="chip_gap"><a></a></li>
+
                         <li class="chip_gap"><a href="https://2015.igem.org/Team:Freiburg/Project/Overview"></a></li>
−
                         <li><a class="navsub1" href="#">Overview</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Project/Overview">Introduction</a></li>
−
                         <li><a class="navsub1" href="#">Background</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Project/System">Overview</a></li>
−
                         <li><a class="navsub1" href="#">Diagnostics today</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Design">Diagnostics today</a></li>
−
                         <li><a class="navsub1" href="#">Methods</a></li>
+
                         <li><a class="navsub1 subsubmenu" href="#">The DiaCHIP</a>
 +
                            <ul>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/DNA_Engineering">DNA Engineering</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/Cellfree_Expression">Cell-Free Expression</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/Protein_Purification">Protein Purification</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/Surface_Chemistry">Surface Chemistry</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/iRIf">Optical Detection</a></li>
 +
                            </ul>
 +
                        </li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Project/Future_Directions">Outlook</a></li>
 
                     </ul>
 
                     </ul>
 
                     <ul id="team-sub">
 
                     <ul id="team-sub">
−
                         <li class="chip_gap"><a></a></li>
+
                         <li class="chip_gap"><a href="https://2015.igem.org/Team:Freiburg/Team"></a></li>
−
                         <li><a class="navsub1" href="#">Members</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Team">Members</a></li>
−
                         <li><a class="navsub1" href="#">Acknowledgements</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Attributions">Acknowledgements</a></li>
−
                         <li><a class="navsub1" href="#">Partners</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Partners">Partners</a></li>
−
                        <li><a class="navsub1" href="#">Collaborations</a></li>
+
 
                     </ul>
 
                     </ul>
 
                     <ul id="results-sub">
 
                     <ul id="results-sub">
−
                         <li class="chip_gap"><a></a></li>
+
                         <li class="chip_gap"><a href="https://2015.igem.org/Team:Freiburg/Results"></a></li>
−
                         <li><a class="navsub1" href="#">The DiaCHIP</a></li>
+
                         <li><a class="navsub1 subsubmenu" href="#">The DiaCHIP</a>
−
                        <li><a class="navsub1" href="#">Modeling</a></li>
+
                            <ul>
−
                         <li><a class="navsub1" href="#">Own Device</a></li>
+
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results">Main Results</a></li>
−
                         <li><a class="navsub1" href="#">Biobricks</a></li>
+
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Diagnostics">Diagnostics</a></li>
−
                         <li><a class="navsub1" href="#">Interlab Study</a></li>
+
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Own_Device">Our Device</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Immobilization">DNA Array</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Cellfree">Cell-Free Expression</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Surface">Binding on Surface</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Results/Modeling">Modeling</a></li>
 +
                            </ul>
 +
                        </li>
 +
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Parts">BioBricks</a></li>
 +
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Collaborations">Collaborations</a></li>
 +
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/InterLab_Study">Interlab Study</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Achievements">Achievements</a></li>
 
                     </ul>  
 
                     </ul>  
 
                     <ul id="policy-sub">
 
                     <ul id="policy-sub">
−
                         <li class="chip_gap"><a></a></li>
+
                         <li class="chip_gap"><a href="https://2015.igem.org/Team:Freiburg/Human_Practice"></a></li>
−
                         <li><a class="navsub1" href="#">Science Fair</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Human_Practice/Science_Fair">Science Fair</a></li>
−
                         <li><a class="navsub1" href="#">Theatre Project</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Human_Practice/Theater_Project">Theater Project</a></li>
−
                         <li><a class="navsub1" href="#">Survey</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Human_Practice/Public_Opinion">Public Opinion</a></li>
−
                         <li><a class="navsub1" href="#">Liberal </a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Human_Practice/College">College Talk</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Human_Practice/Ethics">Ethics</a></li>
 
                     </ul>
 
                     </ul>
 
                     <ul id="notebook-sub">
 
                     <ul id="notebook-sub">
−
                         <li class="chip_gap"><a></a></li>
+
                         <li class="chip_gap"><a href="https://2015.igem.org/Team:Freiburg/Notebook"></a></li>
−
                        <li><a class="navsub1" href="#">Protocols</a></li>
+
                         <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Labjournals">Labjournals</a>
−
                         <li><a class="navsub1" href="#">Labjournal</a>
+
 
                         </li>
 
                         </li>
−
                         <li><a class="navsub1" href="#">Safety</a></li>
+
                         <li><a class="navsub1 subsubmenu" href="#">Techniques</a>
 +
                            <ul>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/Classic_vs_Gibson">Gibson</a></li>
 +
                                <li><a class="navsub2" href="https://2015.igem.org/Team:Freiburg/Project/Coli_Strains">E.coli Strains</a></li>
 +
                            </ul>
 +
                        </li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Protocols">Protocols</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Materials">Materials</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Safety">Safety</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Wikimigration">Wiki-Tricks</a></li>
 +
                        <li><a class="navsub1" href="https://2015.igem.org/Team:Freiburg/Glossary">Glossary</a></li>
 
                             </ul>  
 
                             </ul>  
 
                         </li>
 
                         </li>
Line 531: Line 948:
 
<!-- End of navigation submenu -->
 
<!-- End of navigation submenu -->
 
         </div>
 
         </div>
 +
 
<!-- End of header -->     
 
<!-- End of header -->     
 +
<!-- END: normal Menubar -->
 +
 +
 +
<!-- BEGIN: Mobile Navigation -->
 +
 +
        <div class="clearfix" id="smallnav">
 +
            <ul class="clearfix">
 +
                <li id="home_small"><a href="https://2015.igem.org/Team:Freiburg/Home">Home</a></li>
 +
                <li id="project_small"><a href="https://2015.igem.org/Team:Freiburg/Project/Overview">Project</a></li>
 +
                <li id="results_small"><a href="https://2015.igem.org/Team:Freiburg/Results">Results</a></li>
 +
                <li id="team_small"><a href="https://2015.igem.org/Team:Freiburg/Team">Team</a></li>
 +
                <li id="policy_small"><a href="https://2015.igem.org/Team:Freiburg/Practices">Practice</a></li>
 +
                <li id="notebook_small"><a href="https://2015.igem.org/Team:Freiburg/Notebook">Notebook</a></li> 
 +
            </ul>
 +
            <a href="#" id="pull">Menu</a>
 +
        </div>
 +
 +
<!-- END: Mobile Navigation -->
  
 
     </body>
 
     </body>
 
</html>
 
</html>

Latest revision as of 02:44, 19 September 2015

""