Team:Sheffield/WetLabJournal
From 2014.igem.org
(Difference between revisions)
Line 1: | Line 1: | ||
+ | {{Team:Sheffield/JS:jquery}} | ||
+ | |||
<html> | <html> | ||
<head> | <head> | ||
+ | <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'> | ||
+ | <link href='http://fonts.googleapis.com/css?family=Lato:300' rel='stylesheet' type='text/css'> | ||
<style> | <style> | ||
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/ | #contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/ | ||
- | |||
- | |||
- | |||
- | |||
#top-section { | #top-section { | ||
Line 34: | Line 34: | ||
height: 100%; | height: 100%; | ||
background-color: transparent; | background-color: transparent; | ||
+ | |||
} | } | ||
- | # | + | #navigationBar, #navigationBar ul { |
- | + | margin: 0 auto; | |
- | + | padding: 0; | |
- | + | ||
- | + | ||
} | } | ||
- | + | #navigationBar { | |
position: fixed; | position: fixed; | ||
top: 0px; | top: 0px; | ||
- | + | display: table-row; | |
width: 100%; | width: 100%; | ||
- | + | min-width: 1000px; | |
+ | height: 60px; | ||
+ | list-style: none; | ||
+ | font-family: 'Oswald', sans-serif; | ||
+ | font-size: 16px; | ||
+ | -webkit-transition: background-color 0.5s linear; | ||
+ | -moz-transition: background-color 0.5s linear; | ||
+ | -o-transition: background-color 0.5s linear; | ||
+ | transition: background-color 0.5s linear; | ||
} | } | ||
- | . | + | .menuText { |
- | + | padding-top: 8px; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | . | + | #navigationBar.scrolling { |
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | #navigationBar li { | ||
+ | display: table-cell; | ||
+ | height: 100%; | ||
+ | vertical-align: middle; | ||
+ | float: right; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | #navigationBar > li:hover > ul { | ||
+ | visibility: visible; | ||
+ | opacity: 1; | ||
+ | transition-delay:0s; | ||
+ | } | ||
+ | |||
+ | #navigationBar > li > ul { | ||
+ | visibility: hidden; | ||
position: absolute; | position: absolute; | ||
- | + | width: 170px; | |
+ | margin-top: 8px; | ||
+ | opacity: 0; | ||
+ | -webkit-transition: opacity 0.5s linear; | ||
+ | -moz-transition: opacity 0.5s linear; | ||
+ | -o-transition: opacity 0.5s linear; | ||
+ | transition: opacity 0.5s linear; | ||
+ | } | ||
+ | |||
+ | #navigationBar li a { | ||
+ | display: block; | ||
+ | padding: 10px 10px; | ||
+ | text-decoration: none; | ||
+ | white-space: nowrap; | ||
+ | color: white; | ||
+ | opacity: 0.9; | ||
+ | } | ||
+ | |||
+ | #navigationBar li a.scrolling { | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | #navigationBar li a:hover { | ||
+ | color: #FBA917; | ||
+ | } | ||
+ | |||
+ | #navigationBar > li > ul > li { | ||
width: 100%; | width: 100%; | ||
+ | margin: 0 0 0 0; | ||
+ | } | ||
+ | |||
+ | #navigationBar > li > ul > li > a { | ||
+ | background-color: #5E5E5E; | ||
+ | opacity: 0.9; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | #navigationBar > li > ul > li > a.scrolling { | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | #igemLogo { | ||
+ | height: 40px; | ||
+ | opacity: 0.8; | ||
+ | } | ||
+ | |||
+ | #teamLogo { | ||
+ | float: left; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | |||
+ | #teamLogo li a img { | ||
+ | height: 80px; | ||
+ | -webkit-transition: height 0.25s linear; | ||
+ | -moz-transition: height 0.25s linear; | ||
+ | -o-transition: height 0.25s linear; | ||
+ | transition: height 0.25s linear; | ||
+ | } | ||
+ | |||
+ | #teamLogo li a img.scrolling { | ||
+ | height: 40px; | ||
} | } | ||
</style> | </style> | ||
+ | <script> | ||
+ | $(window).scroll(function() { | ||
+ | if ($(window).scrollTop() > 0) { | ||
+ | $("#navigationBar").addClass("scrolling"); | ||
+ | $("#navigationBar li a").addClass("scrolling"); | ||
+ | $("#teamLogo li a img").addClass("scrolling"); | ||
+ | $("#navigationBar > li > ul > li > a").addClass("scrolling"); | ||
+ | |||
+ | } else { | ||
+ | $("#navigationBar").removeClass("scrolling"); | ||
+ | $("#navigationBar li a").removeClass("scrolling"); | ||
+ | $("#teamLogo li a img").removeClass("scrolling"); | ||
+ | $("#navigationBar > li > ul > li > a").removeClass("scrolling"); | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
</head> | </head> | ||
- | <body> | + | <body class="content"> |
- | < | + | <ul id="navigationBar"> |
- | < | + | <li><a href=""><img id="igemLogo" src="https://static.igem.org/mediawiki/2014/7/7d/IGEMLogo.png"></a></li> |
- | + | <li class="menuText"><a href="">Attributions ▾</a> | |
- | </ | + | <ul> |
- | < | + | <li><a href="">Acknowledgements</a></li> |
- | + | <li><a href="">Sponsors</a></li> | |
- | </ | + | </ul> |
+ | </li> | ||
+ | <li class="menuText"><a href="">Notebook ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">Protocols</a></li> | ||
+ | <li><a href="">Wet Lab Journal</a></li> | ||
+ | <li><a href="">Dry Lab Journal</a></li> | ||
+ | <li><a href="">Bibliography</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Policy and Practices ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">Socio Bricks</a></li> | ||
+ | <li><a href="">Lab Notation</a></li> | ||
+ | <li><a href="">Industry Collaboration</a></li> | ||
+ | <li><a href="">SynBio at UoS</a></li> | ||
+ | <li><a href="">Outreach</a></li> | ||
+ | <li><a href="">Collaboration</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Results ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">FadR Characterisation</a></li> | ||
+ | <li><a href="">Lipase Assay</a></li> | ||
+ | <li><a href="">Keratinase Assay</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Modelling ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">Product Design</a></li> | ||
+ | <li><a href="">Manufacturing Model</a></li> | ||
+ | <li><a href="">Enzyme Kinetics</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Project ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">Background</a></li> | ||
+ | <li><a href="">Biosensor</a></li> | ||
+ | <li><a href="">Enzyme Synthesis</a></li> | ||
+ | <li><a href="">Enzyme Secretion</a></li> | ||
+ | <li><a href="">Safety</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Team ▾</a> | ||
+ | <ul> | ||
+ | <li><a href="">Meet the Team</a></li> | ||
+ | <li><a href="">Official Team Profile</a></li> | ||
+ | <li><a href="">Gallery</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="menuText"><a href="">Home</a></li> | ||
+ | <span id="teamLogo"><li><a href=""><img src="https://static.igem.org/mediawiki/2014/d/da/TeamLogo.png"></a></li></span> | ||
+ | </ul> | ||
</body> | </body> | ||
</html> | </html> | ||
{{Team:Sheffield/NavigationBar}} | {{Team:Sheffield/NavigationBar}} |
Revision as of 20:25, 13 September 2014