Template:Team:Sheffield/NavigationBar
From 2014.igem.org
(Difference between revisions)
(71 intermediate revisions not shown) | |||
Line 9: | Line 9: | ||
if ($(document).scrollTop() > 0) { | if ($(document).scrollTop() > 0) { | ||
$("#navigationBar").addClass("scrolling"); | $("#navigationBar").addClass("scrolling"); | ||
- | |||
$("#teamLogo li a img").addClass("scrolling"); | $("#teamLogo li a img").addClass("scrolling"); | ||
- | $("# | + | $("#shefUniLogo li a img").addClass("scrolling"); |
- | + | ||
- | + | ||
} else { | } else { | ||
$("#navigationBar").removeClass("scrolling"); | $("#navigationBar").removeClass("scrolling"); | ||
- | |||
$("#teamLogo li a img").removeClass("scrolling"); | $("#teamLogo li a img").removeClass("scrolling"); | ||
- | $("# | + | $("#shefUniLogo li a img").removeClass("scrolling"); |
- | + | ||
- | + | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
}); | }); | ||
}); | }); | ||
Line 49: | Line 29: | ||
border: 0 none; | border: 0 none; | ||
height: 14px; | height: 14px; | ||
- | z-index: | + | z-index: 10001; |
/*top: 0;*/ | /*top: 0;*/ | ||
/*position: fixed;*/ | /*position: fixed;*/ | ||
Line 71: | Line 51: | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
- | background- | + | background-image: url('https://static.igem.org/mediawiki/2014/5/5b/BgImgSheffield.jpg'); |
+ | background-repeat: repeat; | ||
} | } | ||
Line 78: | Line 59: | ||
/*overflow-y: scroll;*/ | /*overflow-y: scroll;*/ | ||
height: 100%; | height: 100%; | ||
+ | } | ||
+ | |||
+ | h1 { | ||
+ | text-align: center; | ||
+ | font-family: 'Oswald', sans-serif; | ||
+ | font-size: 40px; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | h2 { | ||
+ | font-family: 'Oswald', sans-serif; | ||
+ | font-size: 30px; | ||
+ | border: none; | ||
+ | line-height: 35px; | ||
+ | } | ||
+ | |||
+ | h3 { | ||
+ | font-family: 'Oswald', sans-serif; | ||
+ | font-weight: bold; | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | |||
+ | p, #bodyContent ul:not(#navigationBar), ol { | ||
+ | font-family: 'Lato', sans-serif; | ||
+ | font-size: 16px; | ||
} | } | ||
Line 89: | Line 95: | ||
top: 0px; | top: 0px; | ||
display: table-row; | display: table-row; | ||
- | |||
- | |||
height: 60px; | height: 60px; | ||
+ | width: 100%; | ||
+ | min-width: 1400px; | ||
list-style: none; | list-style: none; | ||
font-family: 'Oswald', sans-serif; | font-family: 'Oswald', sans-serif; | ||
Line 99: | Line 105: | ||
-o-transition: background-color 0.5s linear; | -o-transition: background-color 0.5s linear; | ||
transition: background-color 0.5s linear; | transition: background-color 0.5s linear; | ||
+ | z-index: 10000; | ||
} | } | ||
Line 126: | Line 133: | ||
visibility: hidden; | visibility: hidden; | ||
position: absolute; | position: absolute; | ||
- | width: | + | width: 220px; |
margin-top: 8px; | margin-top: 8px; | ||
opacity: 0; | opacity: 0; | ||
Line 140: | Line 147: | ||
text-decoration: none; | text-decoration: none; | ||
white-space: nowrap; | white-space: nowrap; | ||
- | color: | + | color: black; |
opacity: 0.9; | opacity: 0.9; | ||
+ | -webkit-touch-callout: none; | ||
+ | -webkit-user-select: none; | ||
+ | -khtml-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | -ms-user-select: none; | ||
+ | user-select: none; | ||
} | } | ||
Line 152: | Line 165: | ||
text-decoration: none; | text-decoration: none; | ||
white-space: nowrap; | white-space: nowrap; | ||
- | color: | + | color: black; |
opacity: 0.9; | opacity: 0.9; | ||
- | |||
- | |||
- | |||
- | |||
} | } | ||
Line 175: | Line 184: | ||
} | } | ||
- | #navigationBar > li > ul > li > a | + | #navigationBar > li > ul > li > a:hover { |
- | color: | + | color: #FBA917; |
} | } | ||
Line 185: | Line 194: | ||
} | } | ||
- | #teamLogo { | + | #teamLogo, #shefUniLogo { |
float: left; | float: left; | ||
margin-right: auto; | margin-right: auto; | ||
} | } | ||
- | #teamLogo li a img { | + | #teamLogo li a img, #shefUniLogo li a img { |
height: 80px; | height: 80px; | ||
-webkit-transition: height 0.25s linear; | -webkit-transition: height 0.25s linear; | ||
Line 199: | Line 208: | ||
#teamLogo li a img.scrolling { | #teamLogo li a img.scrolling { | ||
+ | height: 40px; | ||
+ | } | ||
+ | |||
+ | #shefUniLogo li a img.scrolling { | ||
height: 40px; | height: 40px; | ||
} | } | ||
Line 219: | Line 232: | ||
width: 40px; | width: 40px; | ||
height: 40px; | height: 40px; | ||
- | |||
- | |||
- | |||
- | |||
} | } | ||
.blackIcon { | .blackIcon { | ||
z-index: 1; | z-index: 1; | ||
- | |||
} | } | ||
Line 235: | Line 243: | ||
} | } | ||
- | .socialMediaIcon div:hover > . | + | .socialMediaIcon div:hover > .blackIcon { |
visibility: hidden; | visibility: hidden; | ||
} | } | ||
Line 243: | Line 251: | ||
} | } | ||
- | . | + | .subPageTitle { |
- | + | text-align: center; | |
+ | font-family: 'Lato', sans-serif; | ||
+ | font-size: 60px; | ||
+ | letter-spacing: -2px; | ||
+ | color: white; | ||
+ | font-weight: 300; | ||
+ | margin-top: 100px; | ||
+ | margin-bottom: 70px; | ||
+ | border: none; | ||
} | } | ||
- | . | + | .gap5px { |
- | + | padding-top: 5px; | |
+ | } | ||
+ | .headerImage { | ||
+ | position: absolute; | ||
+ | top: -450px; | ||
+ | width: 100%; | ||
+ | height: 525px; | ||
+ | overflow: hidden; | ||
+ | z-index: -1; | ||
} | } | ||
</style> | </style> | ||
</head> | </head> | ||
- | <body | + | <body> |
- | + | <div id="topMenu"> | |
- | + | <ul id="navigationBar"> | |
- | + | <li><a href="https://igem.org/Main_Page"><img id="igemLogo" src="https://static.igem.org/mediawiki/2014/7/7d/IGEMLogo.png"></a></li> | |
- | + | <li> | |
- | + | <span> | |
- | + | <a class="socialMediaIcon" href="http://twitter.com/iGEMSheffield"> | |
- | + | <div> | |
- | + | <img class="blackIcon" src="https://static.igem.org/mediawiki/2014/b/b2/TwitterBlack.png"> | |
- | + | <img class="colouredIcon" src="https://static.igem.org/mediawiki/2014/7/78/TwitterColour.png"> | |
- | + | </div> | |
- | + | </a> | |
- | + | </span> | |
- | + | </li> | |
- | + | <li> | |
- | + | <span> | |
- | + | <a class="socialMediaIcon" href="http://www.facebook.com/iGEMSheffield2014"> | |
- | + | <div> | |
- | + | <img class="blackIcon" src="https://static.igem.org/mediawiki/2014/b/b6/FacebookBlack.png"> | |
- | + | <img class="colouredIcon" src="https://static.igem.org/mediawiki/2014/1/1b/FacebookColour.png"> | |
- | + | </div> | |
- | + | </a> | |
- | + | </span> | |
- | + | </li> | |
- | + | <li class="menuText"><a style="cursor:default;">Attributions ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/Acknowledgements">Acknowledgements</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/Sponsors">Sponsors</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a style="cursor:default;">Notebook ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/LabProtocols">Lab Protocols</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/WetLabJournal">Wet Lab Journal</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/DryLabJournal">Dry Lab Journal</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a style="cursor:default;">Policy and Practices ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/SocioBrick">SocioBricks</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/sociobricks/main">SocioBrick Registry</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/Notions">Notions of Responsibility</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/IndustryCollaboration">Industry Collaboration</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/SynBio">Synthetic Biology @ Sheffield</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/LabNotation">Lab Notation</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/outreach">Outreach</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/collaboration">Collaboration</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a style="cursor:default;">Results ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/FadR">FadR Characterisation</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/Lipase">Lipase Assay</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/Keratinase">Keratinase Assay</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a style="cursor:default;">Modelling ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/modelling">Product Design</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/manufacture"> ↳ Budget</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/manufacture2"> ↳ Premium</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a href="https://2014.igem.org/Team:Sheffield/Project">Project</a></li> | |
- | + | <li class="menuText"><a style="cursor:default;">Team ▾</a> | |
- | + | <ul> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/team1">Meet the Team</a></li> | |
- | + | <li><a href="https://igem.org/Team.cgi?id=1498">Official Team Profile</a></li> | |
- | + | <li><a href="https://2014.igem.org/Team:Sheffield/gallery">Gallery</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li class="menuText"><a href="https://2014.igem.org/Team:Sheffield">Home</a></li> | |
- | + | <span id="teamLogo"><li><a href="https://2014.igem.org/Team:Sheffield"><img src="https://static.igem.org/mediawiki/2014/d/da/TeamLogo.png"></a></li></span> | |
- | + | <span id="shefUniLogo"><li><a href="http://www.sheffield.ac.uk/"><img src="https://static.igem.org/mediawiki/2014/b/bd/UoSLogo.gif"></a></li></span> | |
- | + | </ul> | |
- | + | </div> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
</body> | </body> | ||
</html> | </html> |
Latest revision as of 03:48, 18 October 2014