Difference between revisions of "Template:Nymu-menu2"

 
(51 intermediate revisions by the same user not shown)
Line 6: Line 6:
 
<style type="text/css">
 
<style type="text/css">
  
/* WIKI SETTINGS*/
+
a.anchor {
+
    display: block;
/* Hide first heading */
+
    position: relative;
.firstHeading {
+
    top: -80px;
display: none;
+
    visibility: hidden;
}
+
}
+
#inthis{
/*-- Remove borders, float content left and remove padding/margin */
+
position:absolute;
#globalWrapper, #content{
+
z-index:1;
margin-top:-4px;
+
}
                width: 100%;
+
height: 100%;
+
border: 0px;
+
background-color: transparent;
+
+
padding: 0px;
+
font-size: 100%;
+
background-color: #fff;
+
}
+
 
+
/*left align Black Menu Bar */
+
#top_menu_inside {  
+
margin-left: 20px;  
+
}
+
 
+
 
+
  
#cssmenu,
+
#cssmenu2,
#cssmenu ul,
+
#cssmenu2 ul,
#cssmenu ul li,
+
#cssmenu2 ul li,
#cssmenu ul li a,
+
#cssmenu2 ul li a,
#cssmenu #menu-button {
+
#cssmenu2 #menu-button {
 
   margin: 0;
 
   margin: 0;
 
   padding: 0;
 
   padding: 0;
Line 48: Line 32:
 
   -moz-box-sizing: border-box;
 
   -moz-box-sizing: border-box;
 
   box-sizing: border-box;
 
   box-sizing: border-box;
 
+
z-index:2;
  
 
   
 
   
 
}
 
}
#cssmenu:after,
+
#cssmenu2:after,
#cssmenu > ul:after {
+
#cssmenu2 > ul:after {
 
   content: ".";
 
   content: ".";
 
   display: block;
 
   display: block;
Line 61: Line 45:
 
   height: 0;
 
   height: 0;
 
}
 
}
#cssmenu #menu-button {
+
#cssmenu2 #menu-button {
 
   display: none;
 
   display: none;
 
}
 
}
#cssmenu {
+
#cssmenu2 {
 
font-family: Montserrat, sans-serif;
 
font-family: Montserrat, sans-serif;
 
background-color: #339933;
 
background-color: #339933;
background-position: 60%;
+
margin-left: 7.5%;
border-top-width: 0px;
+
position: fixed;
border-right-width: 0px;
+
width: 90%;
border-bottom-width: 0px;
+
z-index 2;
border-left-width: 0px;
+
border-top-style: none;
+
border-right-style: none;
+
border-bottom-style: none;
+
border-left-style: none;
+
padding: 0px;
+
margin: 0px;
+
position: absolute;
+
width: 100%;
+
z-index: 99;
+
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
  
Line 86: Line 60:
 
}
 
}
  
#cssmenu.align-center > ul {
+
#cssmenu2.align-center > ul {
 
   font-size: 0;
 
   font-size: 0;
 
   text-align: center;
 
   text-align: center;
 
}
 
}
#cssmenu.align-center > ul > li {
+
#cssmenu2.align-center > ul > li {
 
   display: inline-block;
 
   display: inline-block;
 
   padding-left:20px;
 
   padding-left:20px;
 
   float: none;
 
   float: none;
 
}
 
}
#cssmenu.align-center ul ul {
+
#cssmenu2.align-center ul ul {
 
   text-align: left;
 
   text-align: left;
 
}
 
}
#cssmenu.align-right > ul > li {
+
#cssmenu2.align-right > ul > li {
 
   float: right;
 
   float: right;
 
}
 
}
#cssmenu > ul > li > a {
+
#cssmenu2 > ul > li > a {
 
    
 
    
 
   font-size: 18px;
 
   font-size: 18px;
Line 109: Line 83:
 
   font-weight: 700;
 
   font-weight: 700;
 
   text-transform: uppercase;
 
   text-transform: uppercase;
padding-bottom:10px;
+
padding-bottom:5px;
 
padding-top:10px;
 
padding-top:10px;
  
  
 
}
 
}
#cssmenu > ul > li:hover > a {
+
#cssmenu2 > ul > li:hover > a {
 
   color: #ffffff;
 
   color: #ffffff;
 
}
 
}
#cssmenu > ul > li.has-sub > a {
+
#cssmenu2 > ul > li.has-sub > a {
 
   padding-right: 30px;
 
   padding-right: 30px;
 
}
 
}
#cssmenu > ul > li.has-sub > a:after {
+
#cssmenu2 > ul > li.has-sub > a:after {
 
   position: absolute;
 
   position: absolute;
 
   top: 22px;
 
   top: 22px;
Line 130: Line 104:
 
   content: '';
 
   content: '';
 
}
 
}
#cssmenu > ul > li.has-sub > a:before {
+
#cssmenu2 > ul > li.has-sub > a:before {
 
   position: absolute;
 
   position: absolute;
 
   top: 19px;
 
   top: 19px;
Line 145: Line 119:
 
   transition: all .25s ease;
 
   transition: all .25s ease;
 
}
 
}
#cssmenu > ul > li.has-sub:hover > a:before {
+
#cssmenu2 > ul > li.has-sub:hover > a:before {
 
   top: 23px;
 
   top: 23px;
 
   height: 0;
 
   height: 0;
 
}
 
}
#cssmenu ul ul {
+
#cssmenu2 ul ul {
 
   position: absolute;
 
   position: absolute;
 
   left: -9999px;
 
   left: -9999px;
 
}
 
}
#cssmenu.align-right ul ul {
+
#cssmenu2.align-right ul ul {
 
   text-align: right;
 
   text-align: right;
 
}
 
}
#cssmenu ul ul li {
+
#cssmenu2 ul ul li {
 
   height: 0;
 
   height: 0;
 
   -webkit-transition: all .25s ease;
 
   -webkit-transition: all .25s ease;
Line 164: Line 138:
 
   transition: all .25s ease;
 
   transition: all .25s ease;
 
}
 
}
#cssmenu li:hover > ul {
+
#cssmenu2 li:hover > ul {
 
   left: auto;
 
   left: auto;
 
}
 
}
#cssmenu.align-right li:hover > ul {
+
#cssmenu2.align-right li:hover > ul {
 
   left: auto;
 
   left: auto;
 
   right: 0;
 
   right: 0;
 
}
 
}
#cssmenu li:hover > ul > li {
+
#cssmenu2 li:hover > ul > li {
 
   height: 35px;
 
   height: 35px;
 
}
 
}
#cssmenu ul ul ul {
+
#cssmenu2 ul ul ul {
 
   margin-left: 100%;
 
   margin-left: 100%;
 
   top: 0;
 
   top: 0;
 
}
 
}
#cssmenu.align-right ul ul ul {
+
#cssmenu2.align-right ul ul ul {
 
   margin-left: 0;
 
   margin-left: 0;
 
   margin-right: 100%;
 
   margin-right: 100%;
 
}
 
}
#cssmenu ul ul li a {
+
#cssmenu2 ul ul li a {
 
   border-bottom: 1px solid rgba(150, 150, 150, 0.15);
 
   border-bottom: 1px solid rgba(150, 150, 150, 0.15);
 
   padding: 11px 15px;
 
   padding: 11px 15px;
Line 192: Line 166:
 
   background: #333333;
 
   background: #333333;
 
}
 
}
#cssmenu ul ul li:last-child > a,
+
#cssmenu2 ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {
+
#cssmenu2 ul ul li.last-item > a {
 
   border-bottom: 0;
 
   border-bottom: 0;
 
}
 
}
#cssmenu ul ul li:hover > a,
+
#cssmenu2 ul ul li:hover > a,
#cssmenu ul ul li a:hover {
+
#cssmenu2 ul ul li a:hover {
 
   color: #ffffff;
 
   color: #ffffff;
 
}
 
}
#cssmenu ul ul li.has-sub > a:after {
+
#cssmenu2 ul ul li.has-sub > a:after {
 
   position: absolute;
 
   position: absolute;
 
   top: 16px;
 
   top: 16px;
Line 210: Line 184:
 
   content: '';
 
   content: '';
 
}
 
}
#cssmenu.align-right ul ul li.has-sub > a:after {
+
#cssmenu2.align-right ul ul li.has-sub > a:after {
 
   right: auto;
 
   right: auto;
 
   left: 11px;
 
   left: 11px;
 
}
 
}
#cssmenu ul ul li.has-sub > a:before {
+
#cssmenu2 ul ul li.has-sub > a:before {
 
   position: absolute;
 
   position: absolute;
 
   top: 13px;
 
   top: 13px;
Line 229: Line 203:
 
   transition: all .25s ease;
 
   transition: all .25s ease;
 
}
 
}
#cssmenu.align-right ul ul li.has-sub > a:before {
+
#cssmenu2.align-right ul ul li.has-sub > a:before {
 
   right: auto;
 
   right: auto;
 
   left: 14px;
 
   left: 14px;
Line 236: Line 210:
  
  
#cssmenu ul ul > li.has-sub:hover > a:before {
+
#cssmenu2 ul ul > li.has-sub:hover > a:before {
 
   top: 17px;
 
   top: 17px;
 
   height: 0;
 
   height: 0;
 
}
 
}
 +
 +
 +
#jumpup{
 +
        display: inline-block;
 +
        position: fixed;
 +
        z-index: 98;
 +
        bottom: 3%;
 +
      right:4%;
 +
        cursor:pointer;
 +
        width: 90px;
 +
}
 +
 +
#jumpup div.pic {
 +
    background: url(https://static.igem.org/mediawiki/2015/6/62/Nymu-Top.jpg) no-repeat;
 +
    background-size: 110px;
 +
    height: 110px;
 +
    width: 110px;
 +
}
 +
 +
#jumpup div.infotop {
 +
    padding-right:30px;
 +
    display: none;
 +
    background: url(https://static.igem.org/mediawiki/2015/b/b8/Nymu-top2.png) no-repeat;
 +
    background-size: 70px;
 +
    height: 70px;
 +
    width: 70px;
 +
}
 +
  
  
Line 245: Line 247:
  
  
 +
<script>
 +
$(document).ready(function() {
 +
 +
                                //totop
 +
        $('#jumpup').on('click',function(){$('body, html').animate({scrollTop: 0},1);})
 +
                      .on('mouseover',function(){$(this).find('div.infotop').css('display','block');})
 +
                          .on('mouseout',function(){$(this).find('div.infotop').css('display','none'); }                   
 +
        );
 +
});
 +
</script>
 +
 +
 +
 +
 +
<div id= ' inthis'>
 
 
  
<div id='cssmenu' class='align-center'>
+
<div id='cssmenu2' class='align-center'>
 
   
 
   
 
     <ul>
 
     <ul>
 
      
 
      
       <li><a href='https://2015.igem.org/wiki/index.php?title=Template:NYMU-Taipei2'>HOME</a></li>
+
       <li><a href='https://2015.igem.org/Team:NYMU-Taipei' class="homenav">HOME</a></li>
  
<li class='active'><a href='#'>OVERVIEW</a>
+
<li><a ='#'class="overnav">OVERVIEW</a>
 
         <ul>
 
         <ul>
 
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-overview'>Background</a></li>
 
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-overview'>Background</a></li>
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-wetlab'>Result</a></li>
+
       
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-drylab'>Achievement</a></li>
+
           <li><a href='https://2015.igem.org/Team:NYMU-Taipei/Collaborations' >Collaboration</a></li>
 
+
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-Achievement'>Achievement</a></li>
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-hp'>Parts</a>
+
           <li><a href='https://2015.igem.org/Team:NYMU-Taipei/Parts'>Parts</a>
 +
          <li><a href='https://2015.igem.org/Team:NYMU-Taipei/Attributions'>Attributions</a></li>
 
             <ul>
 
             <ul>
 
               </li>
 
               </li>
Line 268: Line 286:
  
  
       <li class='active'><a href='#'>PROJECT</a>
+
       <li><a href='https://2015.igem.org/Template:NYMU-2015project-wetlab'class="projnav">PROJECT</a>
 
         <ul>
 
         <ul>
   
+
       
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-wetlab'>Experiment</a>
+
 
 +
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-wetlab#experiment'>Experiment</a>
 
           </li>
 
           </li>
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-drylab'>Modeling</a>
+
           <li><a href='https://2015.igem.org/Template:NYMU-2015project-wetlab#modeling'>Modeling</a>
            <ul>
+
          </li>
              <li><a href='https://2015.igem.org/Template:NYMU-2015project-drylab-FYVE'>FYVE</a></li>
+
          <li><a href="https://2015.igem.org/Team:NYMU-Taipei/Design">Functional<br>Prototype</a>
              <li><a href='https://2015.igem.org/Template:NYMU-2015project-drylab-Oscillation'>Oscillation</a></li>
+
              <li><a href='https://2015.igem.org/Template:NYMU-2015project-drylab-Epidemic'>Epidemic</a></li>
+
            </ul>
+
 
           </li>
 
           </li>
 
 
          
 
          
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
       <li><a href='hthttps://2015.igem.org/Template:NYMU-2015project-hp'>POLICY PRACTICES</a></li>
+
       <li><a href='https://2015.igem.org/Team:NYMU-Taipei/Practices' class="ppnav">POLICY PRACTICES</a></li>
  
  
  
  
<li class='active'><a href='https://2015.igem.org/Template:NYMU-2015projectsafety'>BIOSAFETY</a>
+
<li><a href='https://2015.igem.org/Template:NYMU-2015project-safety' class="bsnav">BIOSAFETY</a>
        <ul>   
+
     
          <li><a href='https://2015.igem.org/Template:NYMU-2015projectsafety-lab'>Lab</a>     
+
          </li>
+
          <li><a href='https://2015.igem.org/Template:NYMU-2015projectsafety-environment'>Environment</a>
+
          </li>
+
         
+
        </ul>
+
 
       </li>
 
       </li>
  
Line 308: Line 317:
  
  
       <li class='active'><a href='#'>NOTEBOOK</a>
+
       <li><a class="ntnav">NOTEBOOK</a>
        <ul>    
+
        <ul>
           <li><a href='#'>Lab</a></li>
+
          <li><a href='https://2015.igem.org/wiki/index.php?title=Template:NYMU-2015notebook-calendar'>Calendar</a></li>  
           <li><a href='#'>Protocol</a></li>
+
           <li><a href='https://2015.igem.org/wiki/index.php?title=Template:NYMU-2015notebook-lab'>Lab</a></li>
 +
           <li><a href='https://2015.igem.org/wiki/index.php?title=Template:NYMU-2015notebook-protocol'>Protocol</a></li>
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
 
        
 
        
       <li><a href='#'>TEAM</a></li>
+
       <li><a href='https://2015.igem.org/Team:NYMU-Taipei/Team'class="teamnav">TEAM</a></li>
  
 
    
 
    
 
     </ul>
 
     </ul>
 +
</div>
 +
 +
 +
<div id='jumpup'>
 +
<div class='infotop'></div>
 +
<div class='pic'></div>
 +
</div>
 
</div>
 
</div>
 
</html>
 
</html>

Latest revision as of 16:39, 18 September 2015