Team:SDU-Denmark/menu

From 2009.igem.org

(Difference between revisions)
(New page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equi...)
 
(81 intermediate revisions not shown)
Line 1: Line 1:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-
<title>Horizontal Subnav w/ CSS &amp; jQuery</title>
+
<title></title>
 +
 
<style type="text/css">
<style type="text/css">
body {
body {
-
font: 10px normal Verdana, Arial, Helvetica, sans-serif;
 
margin: 0;
margin: 0;
padding: 0;
padding: 0;
}
}
-
h1 {
+
.container {width: 930px; margin: 0;}
-
font: 4.7em normal Georgia, 'Times New Roman', Times, serif;
+
-
color: #333;
+
-
margin: 0;
+
-
padding: 5px 0;
+
-
}
+
-
h1 small{
+
-
font: 0.2em normal Verdana, Arial, Helvetica, sans-serif;
+
-
text-transform:uppercase;
+
-
letter-spacing: 1.5em;
+
-
display: block;
+
-
color: #fff;
+
-
}
+
-
.container {width: 970px; margin: 0 auto;}
+
-
 
+
Line 30: Line 15:
margin: 0; padding: 0;
margin: 0; padding: 0;
float: left;
float: left;
-
width: 970px;
+
width: 930px;
list-style: none;
list-style: none;
position: relative;
position: relative;
-
font-size: 1.2em;
+
font-size: 1.1em;
-
background: url(topnav_stretch.gif) repeat-x;
+
background: url(https://static.igem.org/mediawiki/2009/1/11/SDU-Denmark-topnav_stretch.gif) repeat-x;
}
}
ul#topnav li {
ul#topnav li {
Line 42: Line 27:
}
}
ul#topnav li a {
ul#topnav li a {
-
padding: 10px 15px;
+
        padding: 10px 15px;
display: block;
display: block;
color: #f0f0f0;
color: #f0f0f0;
text-decoration: none;
text-decoration: none;
 +
font: 12px normal Verdana, Arial, Helvetica, sans-serif;
}
}
-
ul#topnav li:hover { background: #1376c9 url(topnav_active.gif) repeat-x; }
+
ul#topnav li:hover { background: #1376c9 url(https://static.igem.org/mediawiki/2009/a/a7/SDU-Denmark-topnav_active.gif) repeat-x; }
ul#topnav li span {
ul#topnav li span {
float: left;
float: left;
padding: 15px 0;
padding: 15px 0;
position: absolute;
position: absolute;
-
left: 0; top:35px;
+
left: 0; top:33px;
display: none;
display: none;
-
width: 970px;
+
width: 930px;
background: #1376c9;
background: #1376c9;
color: #fff;
color: #fff;
Line 68: Line 54:
ul#topnav li span a:hover {text-decoration: underline;}
ul#topnav li span a:hover {text-decoration: underline;}
</style>
</style>
-
<script type="text/javascript"
+
 
-
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
+
<!-- MENU SCRIPT, http://www.sohtanaka.com -->
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
 +
 
<script type="text/javascript">
<script type="text/javascript">
$(document).ready(function() {
$(document).ready(function() {
-
 
$("ul#topnav li").hover(function() { //Hover over event on list item
$("ul#topnav li").hover(function() { //Hover over event on list item
-
$(this).css({ 'background' : '#1376c9 url(topnav_active.gif) repeat-x'}); //Add background color + image on hovered list item
+
$(this).css({ 'background' : '#1376c9 url(https://static.igem.org/mediawiki/2009/a/a7/SDU-Denmark-topnav_active.gif) repeat-x'}); //Add background color + image on hovered list item
$(this).find("span").show(); //Show the subnav
$(this).find("span").show(); //Show the subnav
} , function() { //on hover out...
} , function() { //on hover out...
Line 80: Line 67:
$(this).find("span").hide(); //Hide the subnav
$(this).find("span").hide(); //Hide the subnav
});
});
-
 
});
});
</script>
</script>
 +
</head>
</head>
Line 88: Line 75:
<div class="container">
<div class="container">
-
<h1>Horizontal Subnav w/ CSS &amp; jQuery</h1>
 
-
<div style="clear: both; display: block; padding-bottom: 20px;"><a href="http://www.sohtanaka.com/web-design/horizontal-sub-nav-with-css-jquery/" style="color: #1376c9;">Horizontal Sub-nav with CSS &amp; jQuery</a> by Soh Tanaka. Check out his <a href="http://www.sohtanaka.com/web-design-blog/" style="color: #1376c9;">Web Design Blog</a> for more tutorials! - Nav inspired by the <a href="http://www.behance.net/" target="_blank">Behance Network</a></div>
+
    <img src="https://static.igem.org/mediawiki/2009/f/fb/SDU-Denmark-header.jpg" />
 +
 
     <ul id="topnav">
     <ul id="topnav">
-
         <li><a href="#">Home</a></li>
+
         <li><a href="https://2009.igem.org/Team:SDU-Denmark">Home</a></li>
         <li>
         <li>
-
             <a href="#">About</a>
+
             <a href="https://2009.igem.org/Team:SDU-Denmark/Background">Background</a>
             <span>
             <span>
-
                 <a href="#">The Company</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Background#Description_of_S._aureus">S. aureus</a> |
-
                 <a href="#">The Team</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Background#Biofilm_Formation">Biofilm</a> |
-
                 <a href="#">Careers</a>
+
                <a href="https://2009.igem.org/Team:SDU-Denmark/Background#Quorum-sensing">Quorum-sensing</a> |
 +
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Background#Quorum-quenching_using_RIP">Quenrum-quenching</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Brainstorm">Brainstorm</a>
             </span>
             </span>
         </li>
         </li>
         <li>
         <li>
-
             <a href="#">Services</a>
+
             <a href="https://2009.igem.org/Team:SDU-Denmark/Project">Project</a>
             <span>
             <span>
-
                 <a href="#">What We Do</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Project#Concept">Concept</a> |
-
                 <a href="#">Our Process</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Project#Methods">Methods</a> |
-
                 <a href="#">Testimonials</a>
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Project#Results">Results</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Project#Implications">Implications</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Protocols">Protocols</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Tools">Tools</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Safety">Safety</a>
             </span>
             </span>
         </li>
         </li>
         <li>
         <li>
-
             <a href="#">Portfolio</a>
+
             <a href="https://2009.igem.org/Team:SDU-Denmark/Parts">Parts</a>
-
            <span>
+
          <span>
-
                 <a href="#">Web Design</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Parts#Our_submitted_parts">Submitted parts</a> |
-
                 <a href="#">Development</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark | /Parts#Contributions_and_improvements_to_existing_parts">Contributions</a> |  
-
                <a href="#">Identity</a> |
+
                 <a href="https://2009.igem.org/Team:SDU-Denmark/Parts/backbone_troubles">pSB1A3 characterization</a>  
-
                 <a href="#">SEO &amp; Internet Marketing</a> |
+
          </span>
-
                <a href="#">Print Design</a>
+
-
 
+
-
            </span>
+
         </li>
         </li>
-
         <li><a href="#">Contact</a></li>
+
         <li><a href="https://2009.igem.org/Team:SDU-Denmark/Team">Team</a>
 +
          <span>
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Team#Students">Students</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Team#Advisors">Advisors</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Team#About_SDU">About SDU</a> |
 +
                <a href="https://2009.igem.org/Team:SDU-Denmark/Helping">What we did to help others</a>
 +
          </span>
 +
        </li>
     </ul>
     </ul>
-
 
</div>
</div>
 +
 +
<br/><br/><br/>
 +
 +
 +
</body>
</body>
</html>
</html>

Latest revision as of 00:18, 22 October 2009