Difference between revisions of "Template:Sicau-china navigation"
| (64 intermediate revisions by 3 users not shown) | |||
| Line 10: | Line 10: | ||
cursor: pointer; | cursor: pointer; | ||
} | } | ||
| − | #sideMenu, | + | #sideMenu,#top_title { |
| − | #top_title { | + | |
display: none; | display: none; | ||
} | } | ||
| Line 18: | Line 17: | ||
width: 100%; | width: 100%; | ||
margin-left:0px; | margin-left:0px; | ||
| + | margin-top:-7px; | ||
} | } | ||
| + | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | ||
/*defines the father box of the navigation bar*/ | /*defines the father box of the navigation bar*/ | ||
| Line 25: | Line 26: | ||
width:100%; | width:100%; | ||
background:url(https://static.igem.org/mediawiki/2017/3/3e/T-SICAU-navigation_background-image.jpg); | background:url(https://static.igem.org/mediawiki/2017/3/3e/T-SICAU-navigation_background-image.jpg); | ||
| − | height: | + | height:150px; |
position:relative; | position:relative; | ||
z-index:99; | z-index:99; | ||
| Line 87: | Line 88: | ||
display:block; | display:block; | ||
} | } | ||
| + | .collapsable_menu_control { | ||
| + | width:100%; | ||
| + | padding: 15px 0px; | ||
| + | display:none; | ||
| + | background-color:#000000; | ||
| + | text-align:center; | ||
| + | font-weight:bold; | ||
| + | color:#72c9b6; | ||
| + | cursor:pointer; | ||
| + | -webkit-transition: all 0.4s ease; | ||
| + | -moz-transition: all 0.4s ease; | ||
| + | -ms-transition: all 0.4s ease; | ||
| + | -o-transition: all 0.4s ease; | ||
| + | transition: all 0.4s ease; | ||
| + | } | ||
| + | .collapsable_menu_control:hover { | ||
| + | background-color: #72c9b6; | ||
| + | color:#000000; | ||
| + | .navigation-menu{display:biock} | ||
| + | } | ||
/* IF THE SCREEN IS LESS THAN 1000PX */ | /* IF THE SCREEN IS LESS THAN 1000PX */ | ||
@media only screen and (max-width: 1000px){ | @media only screen and (max-width: 1000px){ | ||
| Line 104: | Line 125: | ||
.navigation li{font-size:10px;} | .navigation li{font-size:10px;} | ||
.navigation-menu .dropdown-content {min-width: 100px;} | .navigation-menu .dropdown-content {min-width: 100px;} | ||
| − | } | + | } |
| + | |||
| + | /* IF THE SCREEN IS LESS THAN 680PX */ | ||
| + | |||
| + | @media only screen and (max-width: 680px) { | ||
| + | .collapsable_menu_control{display:block} | ||
| + | .up-nav-icon {display:none} | ||
| + | .navigation{ width:100%; height: 15%; position:relative;} | ||
| + | #team-icon img{width:40px;height:40px;top:2px;} | ||
| + | |||
| + | } | ||
</style> | </style> | ||
| Line 110: | Line 141: | ||
<div id="float"> | <div id="float"> | ||
<div class="navigation"> | <div class="navigation"> | ||
| + | <div class="collapsable_menu_control"> MENU ▤ </div> | ||
<div id="team-icon"><a href="https://2017.igem.org/Team:SiCAU-China"> <img src="https://static.igem.org/mediawiki/2017/2/2c/T-SICAU-Sherlock_E.coli.jpg" alt="club's logo" /> </a></div> | <div id="team-icon"><a href="https://2017.igem.org/Team:SiCAU-China"> <img src="https://static.igem.org/mediawiki/2017/2/2c/T-SICAU-Sherlock_E.coli.jpg" alt="club's logo" /> </a></div> | ||
<div class="navigation-menu"> | <div class="navigation-menu"> | ||
| + | |||
| + | |||
| Line 118: | Line 152: | ||
<div class="dropdown-content"> | <div class="dropdown-content"> | ||
<a href="https://2017.igem.org/Team:SiCAU-China/Description">Description</a> | <a href="https://2017.igem.org/Team:SiCAU-China/Description">Description</a> | ||
| − | |||
<a href="https://2017.igem.org/Team:SiCAU-China/Results">Results</a> | <a href="https://2017.igem.org/Team:SiCAU-China/Results">Results</a> | ||
<a href="https://2017.igem.org/Team:SiCAU-China/Contribution">Contribution</a> | <a href="https://2017.igem.org/Team:SiCAU-China/Contribution">Contribution</a> | ||
| − | <li><a href=" | + | <li><a href="https://2017.igem.org/Team:SiCAU-China/Model"><div> |
<img src="https://static.igem.org/mediawiki/2017/thumb/c/c3/T-SICAU-letter_opener.jpg/180px-T-SICAU-letter_opener.jpg.png" alt="Model" class="up-nav-icon" /> | <img src="https://static.igem.org/mediawiki/2017/thumb/c/c3/T-SICAU-letter_opener.jpg/180px-T-SICAU-letter_opener.jpg.png" alt="Model" class="up-nav-icon" /> | ||
| − | + | Model</div></a> | |
| − | <li><a href=" | + | <li><a href="https://2017.igem.org/Team:SiCAU-China/HP/Gold_Integrated"><div> |
<img src="https://static.igem.org/mediawiki/2017/thumb/7/77/T-SICAU-hat.jpg/105px-T-SICAU-hat.jpg.png" alt="practice" class="up-nav-icon" /> | <img src="https://static.igem.org/mediawiki/2017/thumb/7/77/T-SICAU-hat.jpg/105px-T-SICAU-hat.jpg.png" alt="practice" class="up-nav-icon" /> | ||
| − | + | Human Practices</div></a> | |
| − | + | ||
| − | + | <li><a href="#"><div> | |
| − | + | <img src="https://static.igem.org/mediawiki/2017/thumb/a/ab/T-SICAU-door.jpg/180px-T-SICAU-door.jpg.png" alt="Notebook" class="up-nav-icon" />Notebook</div></a> | |
| − | + | <div class="dropdown-content"> | |
| − | <a href="https://2017.igem.org/Team:SiCAU-China/Notebook">Notebook</a></ | + | <a href="https://2017.igem.org/Team:SiCAU-China/Notebook">Notebook</a> |
| + | <a href="https://2017.igem.org/Team:SiCAU-China/Experiments">Protocol</a></div></li> | ||
<li><a href="#"><div> | <li><a href="#"><div> | ||
| Line 139: | Line 173: | ||
<div class="dropdown-content"> | <div class="dropdown-content"> | ||
<a href="https://2017.igem.org/Team:SiCAU-China/Team">Team</a> | <a href="https://2017.igem.org/Team:SiCAU-China/Team">Team</a> | ||
| − | <a href="https://2017.igem.org/Team:SiCAU-China/ | + | <a href="https://2017.igem.org/Team:SiCAU-China/Attributions">Attributions </a> |
| + | <a href="https://2017.igem.org/Team:SiCAU-China/gally">Gallery</a></div></li> | ||
| − | <li><a href=" | + | <li><a href="https://2017.igem.org/Team:SiCAU-China/Collaborations"><div> |
| − | <img src="https://static.igem.org/mediawiki/2017/thumb/a/a6/T-SICAU-pipe.jpg/180px-T-SICAU-pipe.jpg.png" alt=" | + | <img src="https://static.igem.org/mediawiki/2017/thumb/a/a6/T-SICAU-pipe.jpg/180px-T-SICAU-pipe.jpg.png" alt="Collaborations" class="up-nav-icon" /> |
| − | + | Collaborations</div></a> | |
</div> | </div> | ||
</div> | </div> | ||
| + | </div> | ||
| + | |||
| + | <script type="text/javascript"> | ||
| + | window.onload= | ||
| + | function(){ | ||
| + | var oDiv = document.getElementById("float"), | ||
| + | H = 0, | ||
| + | Y = oDiv | ||
| + | while (Y) {H += Y.offsetTop; Y = Y.offsetParent} | ||
| + | window.onscroll = function() | ||
| + | { | ||
| + | var s = document.body.scrollTop || document.documentElement.scrollTop | ||
| + | if(s>H+90) { | ||
| + | oDiv.style = "position:fixed;top:-90px;width:100%;z-index:100;" | ||
| + | } else { | ||
| + | oDiv.style = " " | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | </script> | ||
</html> | </html> | ||
Latest revision as of 22:54, 1 November 2017
project
Model
Human Practices
Notebook
team
Collaborations