Template:Team:Sheffield/NavigationBar

From 2014.igem.org

(Difference between revisions)
 
(80 intermediate revisions not shown)
Line 9: Line 9:
    if ($(document).scrollTop() > 0) {
    if ($(document).scrollTop() > 0) {
        $("#navigationBar").addClass("scrolling");
        $("#navigationBar").addClass("scrolling");
-
        $("#navigationBar li a").addClass("scrolling");
 
        $("#teamLogo li a img").addClass("scrolling");
        $("#teamLogo li a img").addClass("scrolling");
-
        $("#navigationBar > li > ul > li > a").addClass("scrolling");
+
        $("#shefUniLogo li a img").addClass("scrolling");
-
        $(".whiteIcon").addClass("scrolling");
+
-
        $(".blackIcon").addClass("scrolling");
+
    } else {
    } else {
        $("#navigationBar").removeClass("scrolling");
        $("#navigationBar").removeClass("scrolling");
-
        $("#navigationBar li a").removeClass("scrolling");
 
        $("#teamLogo li a img").removeClass("scrolling");
        $("#teamLogo li a img").removeClass("scrolling");
-
        $("#navigationBar > li > ul > li > a").removeClass("scrolling");
+
        $("#shefUniLogo li a img").removeClass("scrolling");
-
        $(".whiteIcon").removeClass("scrolling");
+
-
        $(".blackIcon").removeClass("scrolling");
+
    }
    }
});
});
});
});
-
</script>
 
-
<script>
 
-
$(document).ready(function() { // Document ready
 
-
$( '.inlink' ).on('click', function(event) {
 
-
    event.preventDefault();
 
-
    var target = "#" + $(this).data('target');
 
-
    $('html, body').animate({
 
-
        scrollTop: $(target).offset().top
 
-
    }, 2000);
 
-
});
 
-
}
 
</script>
</script>
<style>
<style>
Line 46: Line 29:
border: 0 none;
border: 0 none;
height: 14px;
height: 14px;
-
z-index: 100;
+
z-index: 10001;
/*top: 0;*/
/*top: 0;*/
/*position: fixed;*/
/*position: fixed;*/
Line 68: Line 51:
width: 100%;  
width: 100%;  
height: 100%;  
height: 100%;  
-
background-color: transparent;
+
background-image: url('https://static.igem.org/mediawiki/2014/5/5b/BgImgSheffield.jpg');
 +
background-repeat: repeat;
}
}
Line 75: 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 86: Line 95:
top: 0px;
top: 0px;
display: table-row;
display: table-row;
-
width: 100%;
 
-
min-width: 1000px;
 
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 96: 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 123: Line 133:
visibility: hidden;
visibility: hidden;
position: absolute;
position: absolute;
-
width: 170px;
+
width: 220px;
margin-top: 8px;
margin-top: 8px;
opacity: 0;
opacity: 0;
Line 137: Line 147:
text-decoration: none;
text-decoration: none;
     white-space: nowrap;
     white-space: nowrap;
-
     color: white;
+
     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 149: Line 165:
text-decoration: none;
text-decoration: none;
     white-space: nowrap;
     white-space: nowrap;
-
     color: white;
+
     color: black;
     opacity: 0.9;
     opacity: 0.9;
-
}
 
-
 
-
#navigationBar li a.scrolling {
 
-
color: black;
 
}
}
Line 172: Line 184:
}
}
-
#navigationBar > li > ul > li > a.scrolling {
+
#navigationBar > li > ul > li > a:hover {
-
color: white;
+
color: #FBA917;
}
}
Line 182: 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 211:
}
}
-
.pageSection1 {
+
#shefUniLogo li a img.scrolling {
-
background-color: #FFFFFF;
+
height: 40px;
-
}
+
-
 
+
-
.pageSection2 {
+
-
background-color: #EBEBEB;
+
}
}
Line 224: Line 232:
width: 40px;
width: 40px;
height: 40px;
height: 40px;
-
}
 
-
 
-
.whiteIcon {
 
-
z-index: 0;
 
}
}
.blackIcon {
.blackIcon {
z-index: 1;
z-index: 1;
-
visibility: hidden;
 
}
}
Line 240: Line 243:
}
}
-
.socialMediaIcon div:hover > .whiteIcon {
+
.socialMediaIcon div:hover > .blackIcon {
visibility: hidden;
visibility: hidden;
}
}
Line 248: Line 251:
}
}
-
.whiteIcon.scrolling {
+
.subPageTitle {
-
visibility: hidden;
+
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;
}
}
-
.blackIcon.scrolling {
+
.gap5px {
-
visibility: visible;
+
padding-top: 5px;
 +
}
 +
.headerImage {
 +
position: absolute;
 +
top: -450px;
 +
width: 100%;
 +
height: 525px;
 +
overflow: hidden;
 +
z-index: -1;
}
}
</style>
</style>
</head>
</head>
-
<body class="content">
+
<body>
-
<ul id="navigationBar">
+
<div id="topMenu">
-
<li><a href=""><img id="igemLogo" src="https://static.igem.org/mediawiki/2014/7/7d/IGEMLogo.png"></a></li>
+
<ul id="navigationBar">
-
<li>
+
<li><a href="https://igem.org/Main_Page"><img id="igemLogo" src="https://static.igem.org/mediawiki/2014/7/7d/IGEMLogo.png"></a></li>
-
<span>
+
<li>
-
<a class="socialMediaIcon" href="http://twitter.com/iGEMSheffield">
+
<span>
-
<div>
+
<a class="socialMediaIcon" href="http://twitter.com/iGEMSheffield">
-
<img class="whiteIcon" src="https://static.igem.org/mediawiki/2014/b/bc/TwitterWhite.png">
+
<div>
-
<img class="blackIcon" src="https://static.igem.org/mediawiki/2014/b/b2/TwitterBlack.png">
+
<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">
+
<img class="colouredIcon" src="https://static.igem.org/mediawiki/2014/7/78/TwitterColour.png">
-
</div>
+
</div>
-
</a>
+
</a>
-
</span>
+
</span>
-
</li>
+
</li>
-
<li>
+
<li>
-
<span>
+
<span>
-
<a class="socialMediaIcon" href="http://www.facebook.com/iGEMSheffield2014">
+
<a class="socialMediaIcon" href="http://www.facebook.com/iGEMSheffield2014">
-
<div>
+
<div>
-
<img class="whiteIcon" src="https://static.igem.org/mediawiki/2014/2/29/FacebookWhite.png">
+
<img class="blackIcon" src="https://static.igem.org/mediawiki/2014/b/b6/FacebookBlack.png">
-
<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">
-
<img class="colouredIcon" src="https://static.igem.org/mediawiki/2014/1/1b/FacebookColour.png">
+
</div>
-
</div>
+
</a>
-
</a>
+
</span>
-
</span>
+
</li>
-
</li>
+
<li class="menuText"><a style="cursor:default;">Attributions &#x25BE;</a>
-
<li class="menuText"><a href="">Attributions &#x25BE;</a>
+
<ul>
-
<ul>
+
<li><a href="https://2014.igem.org/Team:Sheffield/Acknowledgements">Acknowledgements</a></li>
-
<li><a href="">Acknowledgements</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/Sponsors">Sponsors</a></li>
-
<li><a href="">Sponsors</a></li>
+
</ul>
-
</ul>
+
</li>
-
</li>
+
<li class="menuText"><a style="cursor:default;">Notebook &#x25BE;</a>
-
<li class="menuText"><a href="">Notebook &#x25BE;</a>
+
<ul>
-
<ul>
+
<li><a href="https://2014.igem.org/Team:Sheffield/LabProtocols">Lab Protocols</a></li>
-
<li><a href="https://2014.igem.org/Team:Sheffield/LabProtocols">Protocols</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/WetLabJournal">Wet Lab Journal</a></li>
-
<li><a href="">Wet Lab Journal</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/DryLabJournal">Dry Lab Journal</a></li>
-
<li><a href="">Dry Lab Journal</a></li>
+
</ul>
-
<li><a href="">Bibliography</a></li>
+
</li>
-
</ul>
+
<li class="menuText"><a style="cursor:default;">Policy and Practices &#x25BE;</a>
-
</li>
+
<ul>
-
<li class="menuText"><a href="">Policy and Practices &#x25BE;</a>
+
<li><a href="https://2014.igem.org/Team:Sheffield/SocioBrick">SocioBricks</a></li>
-
<ul>
+
<li><a href="https://2014.igem.org/Team:Sheffield/sociobricks/main">SocioBrick Registry</a></li>
-
<li><a href="">Socio Bricks</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/Notions">Notions of Responsibility</a></li>
-
<li><a href="">Lab Notation</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/IndustryCollaboration">Industry Collaboration</a></li>
-
<li><a href="">Industry Collaboration</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/SynBio">Synthetic Biology @ Sheffield</a></li>
-
<li><a href="">SynBio at UoS</a></li>
+
                        <li><a href="https://2014.igem.org/Team:Sheffield/LabNotation">Lab Notation</a></li>
-
<li><a href="">Outreach</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/outreach">Outreach</a></li>
-
<li><a href="">Collaboration</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/collaboration">Collaboration</a></li>
-
</ul>
+
</ul>
-
</li>
+
</li>
-
<li class="menuText"><a href="">Results &#x25BE;</a>
+
<li class="menuText"><a style="cursor:default;">Results &#x25BE;</a>
-
<ul>
+
<ul>
-
<li><a href="">FadR Characterisation</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/FadR">FadR Characterisation</a></li>
-
<li><a href="">Lipase Assay</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/Lipase">Lipase Assay</a></li>
-
<li><a href="">Keratinase Assay</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/Keratinase">Keratinase Assay</a></li>
-
</ul>
+
</ul>
-
</li>
+
</li>
-
<li class="menuText"><a href="">Modelling &#x25BE;</a>
+
<li class="menuText"><a style="cursor:default;">Modelling &#x25BE;</a>
-
<ul>
+
<ul>
-
<li><a href="">Product Design</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/modelling">Product Design</a></li>
-
<li><a href="">Manufacturing Model</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/manufacture">&nbsp;&nbsp;&#8627;&nbsp;&nbsp;Budget</a></li>
-
<li><a href="">Enzyme Kinetics</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/manufacture2">&nbsp;&nbsp;&#8627;&nbsp;&nbsp;Premium</a></li>
-
</ul>
+
</ul>
-
</li>
+
</li>
-
<li class="menuText"><a href="">Project &#x25BE;</a>
+
<li class="menuText"><a href="https://2014.igem.org/Team:Sheffield/Project">Project</a></li>
-
<ul>
+
<li class="menuText"><a style="cursor:default;">Team &#x25BE;</a>
-
<li><a href="">Background</a></li>
+
<ul>
-
<li><a href="">Biosensor</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/team1">Meet the Team</a></li>
-
<li><a href="">Enzyme Synthesis</a></li>
+
<li><a href="https://igem.org/Team.cgi?id=1498">Official Team Profile</a></li>
-
<li><a href="">Enzyme Secretion</a></li>
+
<li><a href="https://2014.igem.org/Team:Sheffield/gallery">Gallery</a></li>
-
<li><a href="">Safety</a></li>
+
</ul>
-
</ul>
+
</li>
-
</li>
+
<li class="menuText"><a href="https://2014.igem.org/Team:Sheffield">Home</a></li>
-
<li class="menuText"><a href="">Team &#x25BE;</a>
+
<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>
-
<ul>
+
<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>
-
<li><a href="">Meet the Team</a></li>
+
</ul>
-
<li><a href="">Official Team Profile</a></li>
+
</div>
-
<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>

Latest revision as of 03:48, 18 October 2014

Retrieved from "http://2014.igem.org/Template:Team:Sheffield/NavigationBar"