Team:Calgary/Sandbox3

From 2011.igem.org

(Difference between revisions)
Line 2: Line 2:
<head>
<head>
 +
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.js"></script>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
 +
<script type="text/javascript">
 +
$(function () {
 +
$(‘.dropdown’).each(function () {
 +
$(this).parent().eq(0).hover(function () {
 +
$(‘.dropdown:eq(0)’, this).show();
 +
}, function () {
 +
$(‘.dropdown:eq(0)’, this).hide();
 +
});
 +
});
 +
});
 +
</script>
 +
<style>
<style>
/***Master styling of text components, because we like consistency***/
/***Master styling of text components, because we like consistency***/
Line 99: Line 113:
/***Now for our own stuff: personalized header images and navbar***/
/***Now for our own stuff: personalized header images and navbar***/
-
#headerbar{
+
#headercontainer{
margin-left: -5px;
margin-left: -5px;
 +
}
 +
 +
#headerbar{
 +
width: 842px;
 +
height: 48px;
 +
background-image: url(https://static.igem.org/mediawiki/2011/e/ef/UCalgary_HeaderBarNew.png);
}
}
/*div containing menu bar*/
/*div containing menu bar*/
ul#topnav{
ul#topnav{
-
margin: 0; padding: 0;
+
display: table;
-
float: left;
+
margin: 0;
-
width: 975px;
+
padding: 0;
-
height: 35px;
+
left: 15px;
 +
top: 15px;
list-style: none;
list-style: none;
position: relative;
position: relative;
-
font-size: 1.2em;
+
 
-
background-image: url(https://static.igem.org/mediawiki/2011/7/7b/UCalgary_NavRepeater.png);
+
-
background-repeat: repeat-x;
+
-
margin-top: -60px; /*moves the bar up into the header image*/
+
}
}
ul#topnav a.navtext{
ul#topnav a.navtext{
-
float: left;
+
position: relative;
display: block;
display: block;
-
height: 35px;
 
-
text-indent: -99999px;
 
background-position: left top;
background-position: left top;
 +
margin-right: 10px;
 +
margin-left: 10px;
}
}
ul#topnav li{
ul#topnav li{
-
float: left;
 
margin: 0;
margin: 0;
padding: 0;
padding: 0;
 +
list-style: none;
 +
display: table-cell;
 +
float: left;
 +
position: relative;
}
}
Line 143: Line 164:
/*Subnavigation*/
/*Subnavigation*/
-
ul#topnav li ul{
+
ul.dropdown{
-
float: left;
+
margin: 0;
-
padding: 5px 0;
+
padding: 0;
 +
padding-bottom: 10px;
 +
padding-top: 7px;
 +
display: block;
position: absolute;
position: absolute;
-
left: -22px; top: 31px;
+
z-index: 999;
-
display: none; /*Default hidden*/
+
width: 250px;
-
width: 975px;
+
display: none;
-
background-image: url(https://static.igem.org/mediawiki/2011/6/69/UCalgary_SubNavRepeater.png);
+
left: 0;
-
background-repeat: repeat-x;
+
/*Background of subnav*/
-
color: black;
+
background-color: #00365E;
 +
opacity: 0.77;
 +
}
 +
 
 +
ul.dropdown li{
 +
margin: 0;
 +
padding: 0;
 +
width: 250px;
 +
float: none;
 +
position: relative;
list-style: none;
list-style: none;
 +
display: block;
}
}
 +
 +
ul.dropdown li a{
 +
display: block;
 +
}
 +
/*Establish sprites for each individual button*/
/*Establish sprites for each individual button*/
#homebutton a{
#homebutton a{
-
margin-left: 60px; /*to center the bar*/
+
background-image: url(https://static.igem.org/mediawiki/2011/1/1d/UCalgary_MenuHome.png);
-
background-image: url(https://static.igem.org/mediawiki/2011/2/21/UCalgary_ButtonHome.png);
+
width: 51px;
-
width: 112px;
+
height: 16px;
}
}
#teambutton a{
#teambutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/1/1e/UCalgary_ButtonTeam.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/4/4f/UCalgary_MenuTeam.png);
-
width: 103px;
+
width: 48px;
 +
height: 16px;
 +
margin-bottom: 17px;
}
}
#projectbutton a{
#projectbutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/9/90/UCalgary_ButtonProject.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/f/f0/UCalgary_MenuProject.png);
-
width: 118px;
+
width: 62px;
 +
height: 19px;
 +
margin-bottom: 14px;
}
}
#partsbutton a{
#partsbutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/c/c5/UCalgary_ButtonParts.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/e/e4/UCalgary_MenuParts.png);
-
width: 100px;
+
width: 45px;
 +
height: 16px;
 +
margin-bottom: 17px;
}
}
#notebookbutton a{
#notebookbutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/e/eb/UCalgary_ButtonNotebook.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/8/84/UCalgary_MenuNotebook.png);
-
width: 143px;
+
width: 84px;
 +
height: 16px;
 +
margin-bottom: 17px;
}
}
#outreachbutton a{
#outreachbutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/5/52/UCalgary_ButtonOutreach.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/9/96/UCalgary_MenuOutreach.png);
-
width: 140px;
+
width: 80px;
 +
height: 17px;
 +
margin-bottom: 16px;
}
}
#sponsorsbutton a{
#sponsorsbutton a{
-
background-image: url(https://static.igem.org/mediawiki/2011/b/b3/UCalgary_ButtonSponsors.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/5/51/UCalgary_MenuSponsors.png);
-
width: 138px;
+
width: 84px;
 +
height: 20px;
 +
margin-bottom: 13px;
 +
}
 +
 
 +
#igembutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/4/49/UCalgary_MenuiGEM.png);
 +
width: 46px;
 +
height: 17px;
 +
margin-bottom: 16px;
 +
}
 +
 
 +
.navtext{
 +
text-indent: -99999px; /*Shoots all HTML text buttons off the page*/
}
}
-
/*Correction of subnavigation menu backgrounds*/
+
/*Adjusting the subnavigation menu*/
ul#topnav li#teambutton ul li a,
ul#topnav li#teambutton ul li a,
ul#topnav li#projectbutton ul li a,
ul#topnav li#projectbutton ul li a,
Line 202: Line 264:
height: 35px;
height: 35px;
background-image: none;
background-image: none;
-
color: #3c3d3d;
 
font-family: Arial;
font-family: Arial;
-
font-size: 1.1em;
+
font-size: 17px;
-
font-weight: 300;
+
font-weight: 400;
}
}
Line 223: Line 284:
ul#topnav li ul li a:hover{
ul#topnav li ul li a:hover{
-
text-decoration: underline;
+
color: #49f0ff;
}
}
Line 265: Line 326:
margin-top: -170px;
margin-top: -170px;
}
}
-
 
-
#backhome{
 
-
color: #07304f;
 
-
font-family: Arial;
 
-
font-size: 1em;
 
-
position: absolute;
 
-
margin-left: 755px;
 
-
margin-top: -190px;
 
-
}
 
-
 
-
#backhome:hover{
 
-
text-decoration: none;
 
-
}
 
/*...Not much, was there.*/
/*...Not much, was there.*/
Line 291: Line 339:
<a href="https://www.facebook.com/pages/Calgary-iGEM/215971681759173"><img id="fb-button" src="https://static.igem.org/mediawiki/2011/d/d8/UCalgary_FacebookF.png"></img></a>
<a href="https://www.facebook.com/pages/Calgary-iGEM/215971681759173"><img id="fb-button" src="https://static.igem.org/mediawiki/2011/d/d8/UCalgary_FacebookF.png"></img></a>
<a href="http://www.twitter.com/iGEMCalgary"><img id="twitter-button" src="https://static.igem.org/mediawiki/2011/4/4e/UCalgary_TwitterT.png"></img></a>
<a href="http://www.twitter.com/iGEMCalgary"><img id="twitter-button" src="https://static.igem.org/mediawiki/2011/4/4e/UCalgary_TwitterT.png"></img></a>
-
<a id="backhome" href="https://2011.igem.org"><img src="https://static.igem.org/mediawiki/2011/b/b3/UCalgary_IGEM_official_logo.png"></img></a>
 
 +
<div id="headercontainer">
<div id="headerbar">
<div id="headerbar">
<ul id="topnav">
<ul id="topnav">
Line 299: Line 347:
<li id="teambutton">
<li id="teambutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Team">Team</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Team">Team</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="https://2011.igem.org/Team:Calgary/Team/Biographies">Biographies</a> | </li>
+
<li><a href="https://2011.igem.org/Team:Calgary/Team/Biographies">Biographies</a></li>
-
<li><a href="https://2011.igem.org/Team:Calgary/Team/Facilitators">Facilitators</a> | </li>
+
<li><a href="https://2011.igem.org/Team:Calgary/Team/Facilitators">Facilitators</a></li>
-
<li><a href="#">The University</a> | </li>
+
<li><a href="#">The University</a></li>
-
<li><a href="https://igem.org/Team.cgi?id=640">Official Profile</a> | </li>
+
<li><a href="https://igem.org/Team.cgi?id=640">Official Profile</a></li>
</ul>
</ul>
</li>
</li>
<li id="projectbutton">
<li id="projectbutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Project">Project</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Project">Project</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="#">Overview</a> | </li>
+
<li><a href="#">Overview</a></li>
-
<li><a href="#">Project Pseudomonas</a> | </li>
+
<li><a href="#">Project Pseudomonas</a></li>
-
<li><a href="#">Project Electro</a> | </li>
+
<li><a href="#">Project Electro</a></li>
-
<li><a href="#">Project Algae</a> | </li>
+
<li><a href="#">Project Algae</a></li>
-
<li><a href="#">Software Tools</a> | </li>
+
<li><a href="#">Software Tools</a></li>
-
<li><a href="#">Future Directions</a> | </li>
+
<li><a href="#">Future Directions</a></li>
</ul>
</ul>
</li>
</li>
<li id="partsbutton">
<li id="partsbutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Parts">Parts</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Parts">Parts</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="#">Parts Submitted</a> | </li>
+
<li><a href="#">Parts Submitted</a></li>
-
<li><a href="#">Characterization</a> | </li>
+
<li><a href="#">Characterization</a></li>
</ul>
</ul>
</li>
</li>
<li id="notebookbutton">
<li id="notebookbutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Notebook">Notebook</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Notebook">Notebook</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="#">Calendar</a> | </li>
+
<li><a href="#">Calendar</a></li>
-
<li><a href="#">Protocols</a> | </li>
+
<li><a href="#">Protocols</a></li>
-
<li><a href="https://2011.igem.org/Team:Calgary/Safety">Safety</a> | </li>
+
<li><a href="https://2011.igem.org/Team:Calgary/Safety">Safety</a></li>
</ul>
</ul>
</li>
</li>
<li id="outreachbutton">
<li id="outreachbutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Outreach">Outreach</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Outreach">Outreach</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="#">Human Practices</a> | </li>
+
<li><a href="#">Human Practices</a></li>
-
<li><a href="#">Conferences</a> | </li>
+
<li><a href="#">Conferences</a></li>
-
<li><a href="#">Forum</a> | </li>
+
<li><a href="#">Forum</a></li>
-
<li><a href="#">Follow Us!</a> | </li>
+
<li><a href="#">Follow Us!</a></li>
</ul>
</ul>
</li>
</li>
<li id="sponsorsbutton">
<li id="sponsorsbutton">
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Sponsors">Sponsors</a>
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Sponsors">Sponsors</a>
-
<ul>
+
<ul class="dropdown">
-
<li><a href="#">Sponsors</a> | </li>
+
<li><a href="#">Sponsors</a></li>
-
<li><a href="#">Acknowledgements</a> | </li>
+
<li><a href="#">Acknowledgements</a></li>
</ul>
</ul>
 +
</li>
 +
<li id="igembutton">
 +
<a class="navtext" href="https://2011.igem.org">iGEM</a>
</li>
</li>
</ul>
</ul>
 +
</div>
</div>
</div>
</body>
</body>
</html>
</html>

Revision as of 22:04, 22 August 2011