Team:Peking/SideBar
From 2010.igem.org
(Difference between revisions)
Evamonlight (Talk | contribs) |
|||
Line 70: | Line 70: | ||
<div id="lsidebar"> | <div id="lsidebar"> | ||
- | < | + | <hr size=4px width=172px color=00009f> |
- | < | + | <font size=3><font color=00009f><b><i>Overview</i></b></font></font> |
- | <html | + | <html> |
<head> | <head> | ||
- | |||
- | |||
- | |||
<style type="text/css"> | <style type="text/css"> | ||
- | + | <!-- | |
- | + | ul#menu { | |
- | + | width: 158px; | |
- | + | list-style: none; | |
+ | border-top: solid 1px #b9a894; | ||
+ | margin: 20px13px7px; | ||
+ | padding: 0; | ||
+ | position: relative; | ||
+ | float: left; | ||
} | } | ||
- | # | + | |
- | + | ul#menu ol { | |
- | list-style:none; | + | display: none; |
- | + | text-align: center; | |
+ | list-style-type: none; | ||
+ | margin: 0px 0; | ||
+ | padding: 0; | ||
} | } | ||
- | # | + | |
- | + | ul#menu li, | |
- | + | ul#menu a { | |
- | + | font-family: "Trebuchet MS", Arial, Sans-serif; | |
- | + | font-size: 13px; | |
- | + | color: #000000; | |
- | + | margin: 0; | |
- | + | ||
- | + | ||
} | } | ||
- | # | + | |
- | + | ul#menu li { | |
+ | border-bottom: solid 1px #b9a894; | ||
+ | line-height: 15px; | ||
} | } | ||
- | # | + | |
- | + | ul#menu ol li { | |
- | + | border-bottom: none; | |
- | + | ||
- | + | ||
} | } | ||
- | + | ||
- | + | ul#menu ol li:before { | |
+ | content: ""; | ||
} | } | ||
- | + | ||
- | display:block; | + | ul#menu a { |
- | width: | + | display: block; |
- | margin:0; | + | width: 150px; |
- | + | height: 19px; | |
+ | border: 1px solid #bbb; | ||
+ | margin-top: 0px; | ||
+ | background: url(https://static.igem.org/mediawiki/2009/0/03/UofA_MainLink.gif) no-repeat left top; | ||
+ | padding: 2px 4px; | ||
+ | text-decoration: none; | ||
+ | color: #000 | ||
+ | outline: none; | ||
} | } | ||
- | # | + | |
- | + | ul#menu a:hover { | |
- | top: | + | display: block; |
- | left: | + | width: 150px; |
+ | height: 19px; | ||
+ | border: 1px solid #bbb; | ||
+ | margin-top: 1px; | ||
+ | background: url(https://static.igem.org/mediawiki/2009/a/a2/UofA_HoverLink.gif) no-repeat left top; | ||
+ | padding: 2px 4px; | ||
+ | color: #0000ff; | ||
} | } | ||
- | + | ||
- | display:none; | + | ul#menu a.active { |
+ | display: block; | ||
+ | margin: 0; | ||
+ | padding: 2px 4px; | ||
+ | width: 150px; | ||
+ | text-decoration: none; | ||
+ | font-weight: bold; | ||
+ | background: url(https://static.igem.org/mediawiki/2009/1/10/UofA_Main.gif) repeat-x bottom; | ||
} | } | ||
+ | --> | ||
</style> | </style> | ||
- | |||
- | |||
- | |||
- | |||
- | < | + | <script type="text/javascript"> |
- | < | + | <!-- |
- | + | /* This script and many more are available free online at | |
+ | The JavaScript Source :: http://javascript.internet.com | ||
+ | Created by: Travis Beckham :: http://www.squidfingers.com | http://www.podlob.com */ | ||
- | + | /* Coded by Travis Beckham | |
- | + | http://www.squidfingers.com | http://www.podlob.com | |
- | + | version date: 06/02/03 | |
- | + | If want to use this code, feel free to do so, but please leave this message intact. */ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | // Node Functions | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | < | + | if(!window.Node){ |
- | <ul> | + | var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3}; |
- | + | } | |
- | <a href=" | + | |
- | + | function checkNode(node, filter){ | |
- | + | return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase()); | |
- | < | + | } |
- | + | ||
- | + | function getChildren(node, filter){ | |
- | + | var result = new Array(); | |
- | + | var children = node.childNodes; | |
- | </ | + | for(var i = 0; i < children.length; i++){ |
- | < | + | if(checkNode(children[i], filter)) result[result.length] = children[i]; |
- | + | } | |
- | </ | + | return result; |
- | < | + | } |
- | </ | + | |
+ | function getChildrenByElement(node){ | ||
+ | return getChildren(node, "ELEMENT_NODE"); | ||
+ | } | ||
+ | |||
+ | function getFirstChild(node, filter){ | ||
+ | var child; | ||
+ | var children = node.childNodes; | ||
+ | for(var i = 0; i < children.length; i++){ | ||
+ | child = children[i]; | ||
+ | if(checkNode(child, filter)) return child; | ||
+ | } | ||
+ | return null; | ||
+ | } | ||
+ | |||
+ | function getFirstChildByText(node){ | ||
+ | return getFirstChild(node, "TEXT_NODE"); | ||
+ | } | ||
+ | |||
+ | function getNextSibling(node, filter){ | ||
+ | for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){ | ||
+ | if(checkNode(sibling, filter)) return sibling; | ||
+ | } | ||
+ | return null; | ||
+ | } | ||
+ | function getNextSiblingByElement(node){ | ||
+ | return getNextSibling(node, "ELEMENT_NODE"); | ||
+ | } | ||
+ | |||
+ | // Menu Functions & Properties | ||
+ | |||
+ | var activeMenu; | ||
+ | var lastClicked; | ||
+ | |||
+ | function showMenu() { | ||
+ | if(activeMenu){ | ||
+ | activeMenu.className = ""; | ||
+ | getNextSiblingByElement(activeMenu).style.display = "none"; | ||
+ | } | ||
+ | if(this == activeMenu) | ||
+ | { | ||
+ | activeMenu = null; | ||
+ | lastClicked = null; | ||
+ | } else { | ||
+ | this.className = "active"; | ||
+ | getNextSiblingByElement(this).style.display = "block"; | ||
+ | activeMenu = this; | ||
+ | lastClicked = this.textContent; | ||
+ | window.name = lastClicked; | ||
+ | } | ||
+ | |||
+ | return false; | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | function initMenu(){ | ||
+ | var menus, menu, text, a, i; | ||
+ | menus = getChildrenByElement(document.getElementById("menu")); | ||
+ | |||
+ | for(i = 0; i < menus.length; i++){ | ||
+ | menu = menus[i]; | ||
+ | text = getFirstChildByText(menu); | ||
+ | a = document.createElement("a"); | ||
+ | menu.replaceChild(a, text); | ||
+ | a.appendChild(text); | ||
+ | a.href = "#"; | ||
+ | a.onclick = showMenu; | ||
+ | a.onfocus = function(){this.blur()}; | ||
+ | if (a.textContent == window.name) | ||
+ | { | ||
+ | a.className = "active"; | ||
+ | getNextSiblingByElement(a).style.display = "block"; | ||
+ | activeMenu = a; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | if(document.createElement) window.onload = initMenu; | ||
+ | //--> | ||
+ | </script> | ||
+ | |||
+ | |||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | <table align=left cellspacing=0 cellpadding=0> | ||
+ | <tr><td> | ||
+ | <ul id="menu"> | ||
+ | <li>DNA Assembly | ||
+ | <ol> | ||
+ | <lie><a href="https://2009.igem.org/Team:Alberta/Project/assemblyoverview">Overview</a> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/ByteCreation">Byte Creation</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/DNAanchor">Anchor/Terminator</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Optimization">Optimization</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/linearconstruct">Linear Constructs</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/plasmidconstruct">Plasmid Constructs</a></li> | ||
+ | </ol> | ||
+ | </li> | ||
+ | <li>Automation | ||
+ | <ol> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/AutomationOverview">Overview</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Microfluidics">Microfluidics</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Automation">DIY Automation</a></li> | ||
+ | </ol> | ||
+ | </li> | ||
+ | <li>Organism Design | ||
+ | <ol> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Bioinformatics">Overview</a> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Gene_Selection">Gene Selection</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Modeling">Modeling</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/ModelValid">Model Validation</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Promoters_&_Terminators">Promoter/Terminator</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Primer_Design">Primer Design</a></li> | ||
+ | </ol> | ||
+ | </li> | ||
+ | <li>Chromosome Assembly | ||
+ | <ol> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Chromosome Assembly">Overview</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Recombineering">Recombineering</a></li> | ||
+ | </ol> | ||
+ | <li>Human Practices | ||
+ | <ol> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Outreach">Overview</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Presentations">Presentations</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Surveys">Feedback</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/UofADebate">U of A Debate</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Debate_Outreach"> HS Debate Outreach</a></li> | ||
+ | <li><a href="https://2009.igem.org/Team:Alberta/Project/Safety">Safety</a></li> | ||
+ | </ol> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </td></tr></table> | ||
- | |||
</body> | </body> | ||
+ | |||
</html> | </html> | ||
- | |||
- | + | <br> | |
- | < | + | |
<font size=3><font color=00009f><b><i>CountDown</i></b></font></font> | <font size=3><font color=00009f><b><i>CountDown</i></b></font></font> | ||
Revision as of 14:59, 10 July 2010