Team:Peking/SideBar
From 2010.igem.org
(Difference between revisions)
Evamonlight (Talk | contribs) |
|||
(54 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | |||
+ | |||
<style type="text/css"> | <style type="text/css"> | ||
- | + | ||
- | + | ||
+ | |||
+ | #main{ | ||
+ | |||
+ | color: FFFFFF | ||
+ | |||
+ | width: 844px; | ||
+ | |||
+ | margin-left: auto; | ||
+ | |||
+ | margin-right: auto; | ||
+ | |||
} | } | ||
/*----------------------------------------------------------------------------*/ | /*----------------------------------------------------------------------------*/ | ||
+ | |||
/* sidebar right */ | /* sidebar right */ | ||
+ | |||
/*----------------------------------------------------------------------------*/ | /*----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
#sidebar { | #sidebar { | ||
+ | |||
width: 172px; | width: 172px; | ||
+ | |||
+ | background-color:FFFFFF | ||
+ | |||
margin: 20px 7px 0 0px; | margin: 20px 7px 0 0px; | ||
+ | |||
position: relative; | position: relative; | ||
+ | |||
float: right; | float: right; | ||
+ | |||
text-align: left; | text-align: left; | ||
+ | |||
} | } | ||
+ | |||
+ | |||
#sidebar_extra { | #sidebar_extra { | ||
+ | |||
margin-top: 0px; | margin-top: 0px; | ||
+ | |||
} | } | ||
+ | |||
+ | |||
#sidebar ul { | #sidebar ul { | ||
+ | |||
padding: 0; | padding: 0; | ||
+ | |||
margin: 0; | margin: 0; | ||
+ | |||
list-style: none; | list-style: none; | ||
+ | |||
} | } | ||
+ | |||
/*----------------------------------------------------------------------------*/ | /*----------------------------------------------------------------------------*/ | ||
+ | |||
/* sidebar left */ | /* sidebar left */ | ||
+ | |||
/*----------------------------------------------------------------------------*/ | /*----------------------------------------------------------------------------*/ | ||
+ | |||
#lsidebar { | #lsidebar { | ||
+ | |||
width: 172px; | width: 172px; | ||
+ | |||
margin: 20px 7px 0 0px; | margin: 20px 7px 0 0px; | ||
+ | |||
position: relative; | position: relative; | ||
+ | |||
float: left; | float: left; | ||
+ | |||
text-align: left; | text-align: left; | ||
+ | |||
} | } | ||
+ | |||
+ | |||
#lsidebar_extra { | #lsidebar_extra { | ||
+ | |||
margin-top: 0px; | margin-top: 0px; | ||
+ | |||
} | } | ||
+ | |||
+ | |||
#lsidebar ul { | #lsidebar ul { | ||
+ | |||
padding: 0; | padding: 0; | ||
+ | |||
margin: 0; | margin: 0; | ||
+ | |||
list-style: none; | list-style: none; | ||
+ | |||
} | } | ||
+ | |||
+ | |||
+ | |||
+ | #text{ | ||
+ | |||
+ | width: 500; | ||
+ | |||
+ | background: transparent; | ||
+ | |||
+ | float: right; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #footer{ | ||
+ | |||
+ | font-size: 2; | ||
+ | |||
+ | clear: both; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
</style> | </style> | ||
+ | |||
+ | |||
</html> | </html> | ||
+ | |||
+ | |||
+ | <div id="main"> | ||
<div id="sidebar"> | <div id="sidebar"> | ||
+ | |||
+ | |||
<hr size=4px width=172px color=00009f> | <hr size=4px width=172px color=00009f> | ||
- | <font size=3><font color=00009f>< | + | |
+ | <font size=3><font color=00009f><font face="Showcard Gothic">News</font></font></font> | ||
+ | |||
<br> | <br> | ||
- | <font size=2> | + | |
+ | <font size=2>Welcome to Peking University iGEM wiki! We began to construct our site on 10 July and it will be updated throughout the summer!</font> | ||
+ | |||
<br> | <br> | ||
- | <font size=2> | + | |
+ | <font size=2>*We have began the laboratory work!</font> | ||
+ | |||
<br> | <br> | ||
+ | |||
+ | <font size=2>*We went to play karaoke this Thursday!</font> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <font size=2>*We attended IGEM CHINA meetup!</font> | ||
+ | |||
+ | |||
+ | |||
<hr size=4px width=172px color=00009f> | <hr size=4px width=172px color=00009f> | ||
- | <font size=3><font color=00009f>< | + | |
+ | <font size=3><font color=00009f><font face="Showcard Gothic">Sponsors</font></font></font> | ||
+ | |||
<br> | <br> | ||
- | <center><html><a href = "http://ctb.pku.edu.cn/main/en/index.htm"><img src="https://static.igem.org/mediawiki/2010/5/52/CTBbanner.gif" width="172px"></a></html></center> | + | |
+ | <center><html><a href = "http://ctb.pku.edu.cn/main/en/index.htm"><img src="https://static.igem.org/mediawiki/2010/5/52/CTBbanner.gif" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://www.bio.pku.edu.cn/english/"><img src="https://static.igem.org/mediawiki/2010/a/a9/SCHOOL_OF_LIFE_SCIENCE.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://yuanpei.pku.edu.cn/index_en.php"><img src="https://static.igem.org/mediawiki/2010/9/9e/YUANPEI_COLLEGE.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://www.chem.pku.edu.cn/index.php?styleid=2"><img src="https://static.igem.org/mediawiki/2010/7/74/COLLEGE_OF_CHEMISTRY_AND_MOLECULAR_ENGINEERING.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://web5.pku.edu.cn/huanjing/"><img src="https://static.igem.org/mediawiki/2010/8/81/COLLEGE_OF_ENVIRONMENTAL_SCIENCES_AND_ENGINEERING.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://dean.pku.edu.cn/"><img src="https://static.igem.org/mediawiki/2010/3/34/PKU_OFFICE_OF_EDUCATIONAL_ADMINISTRATION.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | <center><html><a href = "http://www.bio.pku.edu.cn/syzx/"><img src="https://static.igem.org/mediawiki/2010/6/61/TEACHING_CENTER_FOR_EXPERIMENTAL_BIOLOGY.png" width="172px" height="50px"></a></html></center> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | |||
+ | |||
+ | |||
</div> | </div> | ||
+ | |||
+ | |||
<div id="lsidebar"> | <div id="lsidebar"> | ||
- | < | + | |
- | < | + | <hr size=4px width=172px color=00009f> |
- | <html | + | |
+ | <font size=3><font color=00009f><font face="Showcard Gothic">Overview</font></font></font> | ||
+ | |||
+ | <html> | ||
+ | |||
<head> | <head> | ||
- | + | ||
- | + | ||
- | + | ||
<style type="text/css"> | <style type="text/css"> | ||
- | + | ||
- | + | <!-- | |
- | + | ||
- | + | ul#menu { | |
+ | |||
+ | width: 172px; | ||
+ | |||
+ | list-style: none; | ||
+ | |||
+ | border-top: solid 1px #b9a894; | ||
+ | |||
+ | margin: 20px13px7px; | ||
+ | |||
+ | padding: 0; | ||
+ | |||
+ | position: relative; | ||
+ | |||
+ | float: left; | ||
+ | |||
} | } | ||
- | # | + | |
- | + | ||
- | list-style:none; | + | |
- | + | ul#menu ol { | |
+ | |||
+ | display: none; | ||
+ | |||
+ | text-align: center; | ||
+ | |||
+ | list-style-type: none; | ||
+ | |||
+ | margin: 0px 0; | ||
+ | |||
+ | padding: 0; | ||
+ | |||
} | } | ||
- | # | + | |
- | + | ||
- | + | ||
- | + | ul#menu li, | |
- | + | ||
- | + | ul#menu a { | |
- | + | ||
- | + | font-family: "Comic Sans 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; | + | |
- | width: | + | |
- | margin: | + | ul#menu a { |
- | + | ||
+ | display: block; | ||
+ | |||
+ | width: 160px; | ||
+ | |||
+ | height: 19px; | ||
+ | |||
+ | border: 1px solid #bbb; | ||
+ | |||
+ | margin-top: 0px; | ||
+ | |||
+ | background: url(https://static.igem.org/mediawiki/2010/d/d0/Main.jpg) no-repeat left top; | ||
+ | |||
+ | padding: 2px 4px; | ||
+ | |||
+ | text-decoration: none; | ||
+ | |||
+ | color: #000 | ||
+ | |||
+ | outline: none; | ||
+ | |||
} | } | ||
- | # | + | |
- | + | ||
- | top: | + | |
- | left: | + | ul#menu a:hover { |
+ | |||
+ | display: block; | ||
+ | |||
+ | width: 160px; | ||
+ | |||
+ | height: 19px; | ||
+ | |||
+ | border: 1px solid #bbb; | ||
+ | |||
+ | margin-top: 1px; | ||
+ | |||
+ | background: url(https://static.igem.org/mediawiki/2010/8/8e/ONHOVER.jpg) no-repeat left top; | ||
+ | |||
+ | padding: 2px 4px; | ||
+ | |||
+ | color: #0000ff; | ||
+ | |||
} | } | ||
- | + | ||
- | display:none; | + | |
+ | |||
+ | ul#menu a.active { | ||
+ | |||
+ | display: block; | ||
+ | |||
+ | margin: 0; | ||
+ | |||
+ | padding: 2px 4px; | ||
+ | |||
+ | width: 160px; | ||
+ | |||
+ | text-decoration: none; | ||
+ | |||
+ | font-weight: bold; | ||
+ | |||
+ | background: url(https://static.igem.org/mediawiki/2010/f/f0/Active.jpg) 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){ | ||
+ | |||
+ | var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3}; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | 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> | </head> | ||
+ | |||
<body> | <body> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | < | + | <table align=left cellspacing=0 cellpadding=0> |
- | + | ||
- | < | + | <tr><td> |
- | + | ||
- | + | <ul id="menu"> | |
- | + | ||
- | + | <li>Temp | |
- | + | ||
- | + | <ol> | |
- | + | ||
- | + | <lie><a href="https://2010.igem.org/Team:Peking/Team">Team</a> | |
- | + | ||
- | < | + | <li><a href="https://2010.igem.org/Team:Peking/Project">Project</a></li> |
- | + | ||
- | + | <li><a href="https://2010.igem.org/Team:Peking/Parts">Parts</a></li> | |
- | + | ||
- | < | + | <li><a href="https://2010.igem.org/Team:Peking/Modeling">Modeling</a></li> |
+ | |||
+ | <li><a href="https://2010.igem.org/Team:Peking/Notebook">Notebook</a></li> | ||
+ | |||
+ | <li><a href="https://2010.igem.org/Team:Peking/Human_Practice">Human Practice</a></li> | ||
+ | |||
+ | </ol> | ||
+ | |||
+ | </li> | ||
+ | |||
+ | |||
+ | |||
+ | </ul> | ||
+ | |||
+ | </td></tr></table> | ||
+ | |||
+ | <br><br><br><br><br><br><br><br><br><br><br><br><br><br> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
</body> | </body> | ||
- | |||
- | |||
+ | |||
+ | </html> | ||
<hr size=4px width=172px color=00009f> | <hr size=4px width=172px color=00009f> | ||
- | <font size=3><font color=00009f>< | + | |
+ | <font size=3><font color=00009f><font face="Showcard Gothic">CountDown</font></font></font> | ||
+ | |||
+ | |||
<!--the countdown code--> | <!--the countdown code--> | ||
+ | |||
+ | |||
<html> | <html> | ||
+ | |||
<div id="countdown"> | <div id="countdown"> | ||
- | <object type="application/x-shockwave-flash" data="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co= | + | |
- | <param name="movie" value="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co= | + | <object type="application/x-shockwave-flash" data="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=00009f&bgcolor=ffffff&date_month=11&date_day=4&date_year=0&un=IGEM JAMBOREE 2010&size=small&mo=11&da=4&yr=2010" width="172" height="58"> |
+ | |||
+ | <param name="movie" value="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=00009f&bgcolor=ffffff&date_month=11&date_day=4&date_year=0&un=IGEM JAMBOREE 2010&size=small&mo=11&da=4&yr=2010" /><param name="bgcolor" value="#A9D0F5" /></object> | ||
+ | |||
</div> | </div> | ||
+ | |||
</html> | </html> | ||
+ | |||
+ | |||
<!--end of the countdown code--> | <!--end of the countdown code--> | ||
+ | |||
+ | |||
<br> | <br> | ||
+ | |||
<hr size=4px width=172px color=00009f> | <hr size=4px width=172px color=00009f> | ||
- | <font size=3><font color=00009f>< | + | |
+ | <font size=3><font color=00009f><font face="Showcard Gothic">Vistors From...</font></font></font> | ||
+ | |||
<html> | <html> | ||
+ | |||
<a href="http://www3.clustrmaps.com/counter/maps.php?url=https://2010.igem.org/Team:Peking" id="clustrMapsLink"><img src="http://www3.clustrmaps.com/counter/index2.php?url=https://2010.igem.org/Team:Peking" width="172px" style="border:0px;" alt="Locations of visitors to this page" title="Locations of visitors to this page" id="clustrMapsImg" onerror="this.onerror=null; this.src='http://www2.clustrmaps.com/images/clustrmaps-back-soon.jpg'; document.getElementById('clustrMapsLink').href='http://www2.clustrmaps.com';" /> | <a href="http://www3.clustrmaps.com/counter/maps.php?url=https://2010.igem.org/Team:Peking" id="clustrMapsLink"><img src="http://www3.clustrmaps.com/counter/index2.php?url=https://2010.igem.org/Team:Peking" width="172px" style="border:0px;" alt="Locations of visitors to this page" title="Locations of visitors to this page" id="clustrMapsImg" onerror="this.onerror=null; this.src='http://www2.clustrmaps.com/images/clustrmaps-back-soon.jpg'; document.getElementById('clustrMapsLink').href='http://www2.clustrmaps.com';" /> | ||
+ | |||
</a> | </a> | ||
+ | |||
</html> | </html> | ||
+ | |||
+ | |||
</div> | </div> | ||
+ | |||
+ | <html> | ||
+ | |||
+ | <div id="footer"> | ||
+ | |||
+ | <a href="#">^Top</a> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | </html> |
Latest revision as of 08:37, 17 September 2010