Difference between revisions of "Template:NAU-CHINA/header"

Line 63: Line 63:
 
     display: block;
 
     display: block;
 
}
 
}
−
 
+
/*
 
.menu > ul > li:hover {
 
.menu > ul > li:hover {
 
     background: #f0f0f0;
 
     background: #f0f0f0;
 
     transition: linear 0.5s;
 
     transition: linear 0.5s;
 
}
 
}
−
 
+
*/
 
.menu > ul > li > ul {
 
.menu > ul > li > ul {
 
     display: none;
 
     display: none;
Line 131: Line 131:
 
   <div class="menu">
 
   <div class="menu">
 
     <ul>
 
     <ul>
−
 
−
 
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Notebook">Notebook</a></li>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Notebook">Notebook</a></li>
−
 
−
 
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Safety">Safety</a>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Safety">Safety</a>
 
         <ul>
 
         <ul>
Line 143: Line 139:
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
−
 
−
 
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Human_Practices">Human Practices</a>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Human_Practices">Human Practices</a>
 
         <ul>  
 
         <ul>  
−
          <li><a href="#">Overview</a></li>
+
          <li><a href="#">Overview</a></li>
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
−
 
−
 
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/iGEMCloud">iGEMCloud</a>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/iGEMCloud">iGEMCloud</a>
−
          <ul>
+
        <ul>
 
           <li><a href="#">Overview</a></li>
 
           <li><a href="#">Overview</a></li>
 
           <li><a href="#">Main Function</a></li>
 
           <li><a href="#">Main Function</a></li>
 
         </ul>
 
         </ul>
−
      </li>
+
      </li>
−
 
+
−
 
+
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Modeling">Modeling</a>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA/Modeling">Modeling</a>
 
         <ul>
 
         <ul>
Line 167: Line 157:
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
−
 
 
       <li><a href="#">Project</a>
 
       <li><a href="#">Project</a>
 
         <ul>
 
         <ul>
Line 174: Line 163:
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Results">Results</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Results">Results</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Parts">Parts</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Parts">Parts</a></li>
−
 
+
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Demonstrate">Demonstrate</a></li>  
−
 
+
−
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Demonstrate">Demonstrate</a></li>
+
−
     
+
−
 
+
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/InterLab">Interlab</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/InterLab">Interlab</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Protocols">Protocols</a></li>
 
           <li><a href="https://2018.igem.org/Team:NAU-CHINA/Protocols">Protocols</a></li>
Line 192: Line 177:
 
       </li>
 
       </li>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA">Home</a></li>
 
       <li><a href="https://2018.igem.org/Team:NAU-CHINA">Home</a></li>
−
 
−
 
 
     </ul>
 
     </ul>
 
   </div>
 
   </div>
Line 200: Line 183:
  
 
<script>
 
<script>
−
    /*global $ */
+
 
 
   $(document).ready(function () {
 
   $(document).ready(function () {
−
 
−
      "use strict";
 
−
 
−
 
−
 
−
 
 
       $('.menu > ul > li > ul:not(:has(ul))').addClass('normal-sub');
 
       $('.menu > ul > li > ul:not(:has(ul))').addClass('normal-sub');
−
      //Checks if drodown menu's li elements have anothere level (ul), if not the dropdown is shown as regular dropdown, not a mega menu (thanks Luka Kladaric)
+
       $(".menu > ul > li").mouseover(function (e) {
−
 
+
        $(this).css({"background-color":"#f0f0f0"});
−
 
+
        $(this).children("ul").stop(true, false).slideToggle(300);
−
       $(".menu > ul > li").hover(function (e) {
+
          e.preventDefault();
−
          if ($(window).width() > 943) {
+
−
              $(this).children("ul").stop(true, false).fadeToggle(100);
+
−
              e.preventDefault();
+
−
          }
+
 
       });
 
       });
−
      //If width is more than 943px dropdowns are displayed on hover
+
       $(".menu > ul > li").mouseleave(function (e) {
−
 
+
        $(this).css({"background-color":"#fff"});
−
       $(".menu > ul > li").click(function (e) {
+
        $(this).children("ul").hide();
−
          if ($(window).width() <= 943) {
+
        e.preventDefault();
−
              $(this).children("ul").fadeToggle(150);
+
−
              e.preventDefault();
+
−
          }
+
 
       });
 
       });
−
   
 
 
   });
 
   });
 
</script>
 
</script>

Revision as of 07:26, 3 October 2018