Difference between revisions of "Template:UCAS-China"

 
(43 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 +
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
 
<script>
 
<script>
−
$(document).ready(function(){$("#HQ_page").attr("id","");highlight_current_page_menu();$(".menu_item").click(function(){$(".submenu_control_icon",this).toggleClass("open");$(this).next(".submenu").fadeToggle(400)});$(".igem_2018_team_mobile_bar").click(function(){$(this).next().toggleClass("displaying_menu")})});function highlight_current_page_menu(){var page_url="https://2018.igem.org/";page_url=page_url+wgPageName;$("a[href$='"+page_url+"']").children().addClass("current_page");if($(".current_page").hasClass("submenu_item")){$(".current_page").parent().parent().fadeToggle(400);$(".current_page").parent().parent().prev().addClass("current_page");$(".menu_item.current_page > .submenu_control_icon").toggleClass("open")}};
+
    function hide_show_menu() {
−
</script>
+
      if (window.location.href.indexOf("submit") >= 0) {
 +
        $(".igem_2017_menu_wrapper").hide();
 +
      }
  
 +
        if (document.getElementById('bars_item')) {
  
−
<style>
+
        $("#bars_item").click(function() {
−
#home_logo,#sideMenu{display:none}#sideMenu,#top_title,.patrollink{display:none}#content{margin-left:0;margin-top:-7px;padding:0;width:100%}body{background-color:white}#bodyContent h1,#bodyContent h2,#bodyContent h3,#bodyContent h4,#bodyContent h5{margin-bottom:0}.judges-will-not-evaluate{border:4px solid #e4dede;padding:2%!important;width:92%!important}.igem_2018_team_menu{background-color:#c4baba;border-left:1px solid #c4baba;display:block;float:right;height:100vh;max-width:270px;overflow-y:auto;overflow-x:hidden;padding:0;position:fixed;right:0;text-align:left;width:15%}.igem_2018_team_menu.displaying_menu{display:block}.igem_2018_team_menu a{color:#484848;text-decoration:none}.igem_2018_team_menu img{width:100%}.igem_2018_team_menu .menu_item{background-color:#c4baba;border-bottom:1px solid #928b8b;clear:both;color:#484848;cursor:pointer;float:left;font-size:120%;font-weight:bold;padding:15px 0 15px 5%;width:100%}.igem_2018_team_menu .menu_item.direct_link{color:#484848;padding-left:15%}.igem_2018_team_menu .menu_item:hover{background-color:#ecb656}.igem_2018_team_menu .menu_item .submenu_control_icon{color:#484848;float:left;width:10%}.igem_2018_team_menu .menu_item .submenu_control_icon::before{content:"+"}.igem_2018_team_menu .menu_item .submenu_control_icon.open::before{content:"-"}.igem_2018_team_menu .submenu{background-color:#e4dede;clear:both;display:none;float:left;width:100%}.igem_2018_team_menu .submenu .submenu_item{border-bottom:1px solid #c4baba;color:#635d5d;height:30px;float:left;font-size:110%;font-weight:bold;padding:12px 0 0 15%;width:100%}.igem_2018_team_menu .submenu .submenu_item:hover{background-color:#f3bd5d}.igem_2018_team_menu .submenu .submenu_item.current_page,.igem_2018_team_menu .menu_item.current_page,.igem_2018_team_menu .menu_item.direct_link.current_page{background-color:#7acbd8}.igem_2018_team_mobile_bar{background-color:#e4dede;border-bottom:1px solid #c4baba;cursor:pointer;display:none;float:left;margin-top:0;padding:5px 0;position:fixed;width:100%}.igem_logo_mobile img{width:70px}.igem_logo_mobile{float:left;padding-left:5%;width:30%}.igem_menu_control_mobile img{width:25px}.igem_menu_control_mobile{float:right;padding-right:5%;padding-top:5px;text-align:right;width:30%}.igem_2018_team_content{background-color:white;display:block;width:87%}.igem_2018_team_content .igem_2018_team_column_wrapper{margin:auto;max-width:1400px;width:90%}.igem_2018_team_content .igem_2018_team_column_wrapper h1{font-size:210%}.igem_2018_team_content .igem_2018_team_column_wrapper h2{font-size:190%}.igem_2018_team_content .igem_2018_team_column_wrapper h3{font-size:170%}.igem_2018_team_content .igem_2018_team_column_wrapper h4{font-size:150%}.igem_2018_team_content .igem_2018_team_column_wrapper h5{font-size:140%}.igem_2018_team_content .igem_2018_team_column_wrapper h6{font-size:130%}.igem_2018_team_content .igem_2018_team_column_wrapper h1,.igem_2018_team_content .igem_2018_team_column_wrapper h2{border-bottom:0;color:#635d5d;font-family:"Arial Black",Gadget,sans-serif;padding:10px 0}.igem_2018_team_content .igem_2018_team_column_wrapper h3,.igem_2018_team_content .igem_2018_team_column_wrapper h4,.igem_2018_team_content .igem_2018_team_column_wrapper h5,.igem_2018_team_content .igem_2018_team_column_wrapper h6{border-bottom:0;color:#928b8b;font-family:"Arial Black",Gadget,sans-serif;padding:5px 0}.igem_2018_team_content .igem_2018_team_column_wrapper p{font-size:130%;font-family:Arial,Helvetica,sans-serif;padding:5px 0;text-align:left;color:#484848}.igem_2018_team_content .igem_2018_team_column_wrapper a{color:#5bc7d8;font-weight:bold;text-decoration:underline;text-decoration-color:#5bc7d8;transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease}.igem_2018_team_content .igem_2018_team_column_wrapper a:hover{color:#f8b732;text-decoration:none}.igem_2018_team_content .igem_2018_team_column_wrapper table{border:1px solid #928b8b;border-collapse:collapse;font-size:130%;width:100%}.igem_2018_team_content .igem_2018_team_column_wrapper td{border:1px solid #c4baba;border-collapse:collapse;font-size:105%;padding:10px;vertical-align:text-top}.igem_2018_team_content .igem_2018_team_column_wrapper th{background-color:#c4baba;border:1px solid #928b8b;border-collapse:collapse;font-size:110%;padding:10px;vertical-align:text-top}.igem_2018_team_content .igem_2018_team_column_wrapper ul,.igem_2018_team_content .igem_2018_team_column_wrapper ol{font-size:130%;font-family:Arial,Helvetica,sans-serif;padding:0 20px}.igem_2018_team_content .igem_2018_team_column_wrapper ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ul ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ul ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol ul li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ol ol li,.igem_2018_team_content .igem_2018_team_column_wrapper ol ul ol li{font-size:76%}
+
          $("#sideMenu").hide();
−
.igem_2018_team_content .igem_2018_team_column_wrapper .column{float:left;margin:1% 2%;padding:0}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size{width:96%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size{width:62.6%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size{width:29.3%}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size img,.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size img,.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size img{margin-bottom:15px;width:100%}.igem_2018_team_content .igem_2018_team_column_wrapper .clear{clear:both}.igem_2018_team_content .igem_2018_team_column_wrapper .clear.extra_space{height:30px}.igem_2018_team_content .igem_2018_team_column_wrapper .line_divider{border-top:1px solid #c4baba;margin:auto;width:98%}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link{font-size:130%;margin:30px auto;text-align:center}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link a{background-color:#5bc7d8;color:#635d5d!important;font-weight:bold;margin:auto;text-decoration:none!important;padding:10px 15px}.igem_2018_team_content .igem_2018_team_column_wrapper .button_link a:hover{background-color:#f8b732!important}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight{padding:15px 20px}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight p,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h1,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h2,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h3,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h4,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h5,.igem_2018_team_content .igem_2018_team_column_wrapper .highlight h6{padding:5px 15px}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_background{background-color:#e4dede}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_A_top{border-top:4px solid #5bc7d8}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_A_full{border:4px solid #5bc7d8}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_B_top{border-top:4px solid #f8b732}.igem_2018_team_content .igem_2018_team_column_wrapper .highlight.decoration_B_full{border:4px solid #f8b732}@media only screen and (max-width:1800px){.igem_2018_team_content{width:85%}.igem_2018_team_menu{display:block}}@media only screen and (max-width:1400px){.igem_2018_team_menu .menu_item{font-size:100%}.igem_2018_team_menu .submenu .submenu_item{font-size:90%}.igem_2018_team_menu{display:block}}@media only screen and (max-width:1001px){.igem_2018_team_menu{display:block}}@media only screen and (max-width:1000px){.igem_2018_team_content{width:100%;margin-left:0}.igem_2018_team_menu{display:none;margin-top:45px;min-width:50%;width:50%}.igem_2018_team_mobile_bar{display:block}.igem_2018_team_content .igem_2018_team_column_wrapper .column.full_size,.igem_2018_team_content .igem_2018_team_column_wrapper .column.two_thirds_size,.igem_2018_team_content .igem_2018_team_column_wrapper .column.third_size{width:96%}}@media only screen and (max-width:500px){.igem_2018_team_menu{min-width:100%;width:100%}}
+
 
−
</style>
+
          $(".igem_2017_menu_wrapper").fadeToggle("100");
 +
        });  
 +
        }  
 +
      else {
 +
            setTimeout(hide_show_menu, 15);
 +
      }
 +
    }
 +
</script>
  
 
<head>  
 
<head>  
−
<meta name="viewport" content="width=device-width, initial-scale=1">  
+
 
 +
  <!-- This tells the browser that your page is responsive -->
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">  
 +
        <!-- This is from CSS templates -->
 +
  <!--<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">-->
 +
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
 +
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 +
  <script type="text/javascript" async
 +
    src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
 +
  </script>
 +
 
 +
  <!-- Latest compiled and minified CSS -->
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 +
  <style type="text/css">
 +
    /****************************** DEFAULT WIKI SETTINGS  ****************************/
 +
 
 +
 
 +
  body,h1,h2,h3,h4,h5,h6,p {font-family: "Raleway", sans-serif; line-height: 1.5}
 +
 
 +
        body, html {
 +
        height: 100%;
 +
        line-height: 2;
 +
        }
 +
 
 +
    #home_logo, #sideMenu { display:none; }
 +
    #sideMenu, #top_title, .patrollink  {display:none;}
 +
    #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 +
    body {background-color:#000000; }
 +
    #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5, #bodyContent p {
 +
        font-family: "Raleway", sans-serif;
 +
        line-height: 1.5;
 +
        margin-bottom: 0px;
 +
       
 +
    }
 +
 
 +
 
 +
 
 +
/**************************** NAVBAR *************************************/
 +
 
 +
/* Add a dark background color with a little bit see-through */
 +
.navbar {
 +
    left: -20px !important;
 +
    right: -20px !important;
 +
    top: -20px !important;
 +
    padding-top: 25px;
 +
    padding-bottom: 5px;
 +
    padding-left: 25px;
 +
    padding-right: 25px;
 +
    background-color: rgb(25, 55, 89);
 +
    border-color: transparent;
 +
    border: 0;
 +
    font-size: 13px !important;
 +
    letter-spacing: 1px;
 +
    /*opacity:0.95;*/
 +
    margin-top: 17px;
 +
    transition: background-color 0.5s ease-out;
 +
}
 +
 
 +
.navbar-nav {
 +
    margin-top: 2.1em !important;
 +
}
 +
 
 +
.navbar li {
 +
    margin: 0 2px;
 +
    border-radius: 5px;
 +
}
 +
 
 +
/* Add a gray color to all navbar links */
 +
.navbar li a, .navbar .navbar-brand {
 +
    color: #fff;
 +
    border-radius: 5px;
 +
}
 +
 
 +
/* the color of the single Link ('safety') on hover */
 +
.navbar-nav li a:hover {
 +
    color: #193759;//changed
 +
}
 +
 
 +
/* The active link this seems to be useless at the moment*/
 +
.navbar-nav li.active a {
 +
    color: #fff;
 +
    background-color:#29292c;
 +
}
 +
 
 +
/* Remove border color from the collapsible button */
 +
.navbar-default .navbar-toggle {
 +
    border-color: transparent;
 +
}
 +
 
 +
.navbar-default {
 +
    border-color:transparent;
 +
}
 +
 
 +
.navbar-collapse>ul:before {
 +
    content: "";
 +
    margin-top: 40px;
 +
}
 +
 
 +
@media (min-width: 768px){
 +
    .navbar-collapse>ul:before {
 +
        content: "";
 +
        margin-top: 0px;
 +
    }
 +
 
 +
    .navbar-right {
 +
        margin-right: 2% !important;
 +
    }
 +
 
 +
    .navbar-header {
 +
        margin-left: 2% !important;
 +
    }
 +
   
 +
    .navbar>li>a {
 +
        padding: 10px 15px;
 +
    }
 +
}
 +
@media (max-width: 761px){
 +
.dropdown-menu li a {
 +
    color: #ffffff;
 +
    letter-spacing: 1px;
 +
}
 +
}
 +
 
 +
/* the color of the Dropdown on click */
 +
.open .dropdown-toggle {
 +
    color: #193759;//changed
 +
    background-color: #fff;
 +
}
 +
 
 +
/* the color of the Dropdown links */
 +
.dropdown-menu li a {
 +
    color: #000;
 +
    letter-spacing: 1px;
 +
}
 +
 
 +
/* the color of the dropdown links on hover */
 +
.dropdown-menu li a:hover {
 +
    background-color: #fff;
 +
}
 +
 
 +
.navbar-toggle .icon-bar {
 +
    background: white;
 +
}
 +
 
 +
.navbar-header img {
 +
    height: 80px;
 +
}
 +
 
 +
#globalWrapper {
 +
    margin-bottom: 0px;
 +
    padding-bottom: 0px;
 +
}
 +
 
 +
#top_menu_14 {
 +
    height: 18px;
 +
}
 +
 
 +
#top_menu_14 #user_item {
 +
    margin-top: -3px;
 +
    padding-top: 0px;
 +
}
 +
 
 +
#top_menu_14 #bars_item img {
 +
    vertical-align: top;
 +
}
 +
 
 +
@media (max-width: 810px) {
 +
    #home-link {
 +
        display:none;
 +
    }
 +
}
 +
 
 +
.nav .open>a, .nav>li>a:hover, .nav .open:hover>a, .nav .dropdown:hover>a{
 +
    background-color: white;
 +
    border: none;
 +
    border-bottom-left-radius: 0px;
 +
    border-bottom-right-radius: 0px;
 +
    box-shadow: 0px 6px 12px rgba(0,0,0,.175);
 +
    color: #193759;//changed
 +
}
 +
 
 +
.nav .open .dropdown-menu, .nav .dropdown-menu {
 +
    border: none;
 +
    border-top-left-radius: 4px !important;
 +
}
 +
 
 +
.nav .open>a:hover, .nav a:focus {
 +
    background-color: white !important;
 +
}
 +
 
 +
@media (min-width: 979px) {
 +
  ul.nav li.dropdown:hover > ul.dropdown-menu {
 +
    display: block;
 +
  }
 +
}
 +
 
 +
.navbar.scrolled {
 +
    background-color: rgba(0,33,71,0.9);
 +
}
 +
 
 +
@media (min-width: 1200px) {
 +
    .container {
 +
        width: 1000px;
 +
    }
 +
}
 +
 
 +
 
 +
/**** PAGE CONTENT ****/
 +
 
 +
#bodyContent {
 +
    background-color: #000000;
 +
}
 +
 
 +
#bodyContent h1 {
 +
    text-align: center;
 +
    font-size: 48pt;
 +
    font-weight: lighter;
 +
    color: #fff;
 +
 
 +
}
 +
 
 +
#bodyContent h2 {
 +
    text-align: center;
 +
    font-size: 24pt;
 +
    font-weight: bold;
 +
    margin-top: calc(8vh);
 +
    margin-bottom: calc(5vh);
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h3 {
 +
    text-align: left;
 +
    font-size: 14pt;
 +
    font-weight: bold;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h4 {
 +
    text-align: left;
 +
    font-size: 14pt;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent h5 {
 +
    text-align: center;
 +
    font-size: 12pt;
 +
    color: #ccc;
 +
}
 +
 
 +
#bodyContent p {
 +
    font-size: 14pt;
 +
    margin-top: 10px;
 +
color: #fff;
 +
}
 +
 
 +
#bodyContent .table {
 +
    font-size: 12pt;
 +
   
 +
}
 +
.img-center {
 +
    margin: 6pt auto;
 +
}
 +
 
 +
.img-reponsive {
 +
    margin-top: 6pt;
 +
    margin-bottom: 6pt;
 +
 
 +
}
 +
#bodyContent .imager{
 +
float: right;
 +
/*width: 200px;*/
 +
text-align: center;
 +
font-size: 12px;
 +
padding-left: 20px;
 +
 
 +
}
 +
 
 +
#bodyContent strong{
 +
    text-align: justify;
 +
    padding: calc(4vh);
 +
    font-size: 25px;
 +
line-height; 2.5;
 +
    color: white;
 +
}
 +
#bodyContent b{
 +
    color: white;
 +
    text-align: justify;
 +
    padding-top: 10px;
 +
    padding-bottom: 10px;
 +
}
 +
 
 +
#bodyContent .imagel{
 +
float: left;
 +
/*width: 200px;*/
 +
text-align: center;
 +
font-size: 12px;
 +
padding-right: 20px;
 +
 
 +
}
 +
 
 +
#side {
 +
    float: left;
 +
padding-right: 20px;
 +
padding-top: 15px;
 +
}
 +
#sider {
 +
    float: right;
 +
padding-left: 20px;
 +
padding-top: 15px;
 +
}
 +
 
 +
.container a{
 +
  color: #71C671;
 +
}
 +
 
 +
.container table, .container td, .contain .tr{
 +
    border: 0;
 +
    border-color: transparent;
 +
}
 +
  </style>
 +
 
 +
  <!-- Latest compiled JavaScript -->
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
 
 +
  <!-- Google Analytics -->
 +
  <script>
 +
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 +
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 +
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 +
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
 +
 
 +
  ga('create', 'UA-102136418-1', 'auto');
 +
  ga('send', 'pageview');
 +
 
 +
  </script>
 +
 
 +
 
 
</head>
 
</head>
 +
 +
 +
<!-- THIS IS WHERE THE HTML BEGINS -->
 +
 +
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="50">
 +
 +
<nav class= "navbar-fixed-top navbar">
 +
  <div class="container-fluid">
 +
    <div class="navbar-header">
 +
      <!-- This allows the navigation bar to be replaced by a button in the top right corner when screen is to small -->
 +
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
      </button>
 +
 +
      <!-- This is the logo -->
 +
    <a href="https://2018.igem.org/Team:UCAS-China" class="navbar-left"><img src="https://static.igem.org/mediawiki/2018/c/cb/T--UCAS-China--_Logo_1_PNG.png"></a>
 +
 +
    </div>
 +
    <div class="collapse navbar-collapse" id="myNavbar">
 +
      <ul class="nav navbar-nav navbar-right">
 +
       
 +
        <li id="home-link"><a href="https://2018.igem.org/Team:UCAS-China">HOME</a></li>
 +
       
 +
        <!-- This is the project dropdown -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PROJECT
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Description">DESCRIPTION</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/LightToColor">LIGHT TO COLOR</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/LightToOdor">LIGHT TO ODOR</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/SoundToLight">SOUND TO LIGHT</a></li>
 +
           
 +
          </ul>
 +
        </li>
 +
 +
        <!-- This is the results button -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">RESULTS
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Validated_contribution">PROOF OF CONCEPT</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Demonstrate">DEMONSTRATE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Software">SOFTWARE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Hardware">HARDWARE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Model">MODEL</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Improve">IMPROVE</a></li>
 +
         
 +
           
 +
           
 +
          </ul>
 +
        </li>
 +
<!-- This is the PARTS button -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PARTS
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Composite_Part">BASIC & COMPOSITE PARTS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Part_Collection">PART COLLECTION</a></li>     
 +
          </ul>
 +
        </li>
 +
 +
 +
 +
          <!-- This is the human practices dropdown -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">HUMAN PRACTICE
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices">OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/Gold_overview">GOLD—OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/Gold_art-and-science">GOLD—ART X SCIENCE</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/orpheus">GOLD—ORPHEUS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/gifts_for_the_world">GOLD—GIFTS FOR THE WORLD!</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_overview">SILVER—OVERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Collaborations">SILVER—COLLABORATIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_education">SILVER—EDUCATION</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Human_Practices/silver_interview">SILVER—INTERVIEW</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Public_Engagement">SILVER—PUBLIC ENGAGEMENT</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/HP_safety">SILVER—SAFETY & SECURITY</a></li>
 +
 +
 +
         
 +
          </ul>
 +
        </li>
 +
 +
 +
 +
        <!-- This is the people dropdown -->
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">PEOPLE
 +
            <span class="caret"></span>
 +
          </a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Meet_the_Team">MEET THE TEAM!</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Attributions">ATTRIBUTIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Medal_Achievements">ACHIEVEMENTS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/Notebook">NOTEBOOK</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/Contributions">CONTRIBUTIONS</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/safety">SAFETY & SECURITY</a></li>
 +
            <li><a href="https://2018.igem.org/Team:UCAS-China/People/acknowledgement">ACKNOWLEDGEMENT</a></li>
 +
          </ul>
 +
        </li>
 +
 +
        <!-- This is the search button -->
 +
      </ul>
 +
    </div>
 +
  </div>
 +
</nav>
 +
<script>
 +
//
 +
function checkScroll(){
 +
    var startY = 200; //The point where the navbar changes in px
 +
 +
    if($(window).scrollTop() > startY){
 +
        $('.navbar').addClass("scrolled");
 +
    }else{
 +
        $('.navbar').removeClass("scrolled");
 +
    }
 +
}
 +
 +
if($('.navbar').length > 0){
 +
    $(window).on("scroll load resize", function(){
 +
        checkScroll();
 +
    });
 +
}
 +
</script>

Latest revision as of 06:48, 1 December 2018