Team:Alberta/LeftBar

From 2009.igem.org

(Difference between revisions)
(Undo revision 53716 by Kellyr (Talk))
m (template expanding menus)
Line 1: Line 1:
-
{{:Team:Alberta/LeftBarCSS}}
+
<html>
 +
<head>
 +
<style type="text/css">
 +
<!--
 +
ul#menu {
 +
  width: 100px;
 +
  list-style-type: none;
 +
  border-top: solid 1px #b9a894;
 +
  margin: 0;
 +
  padding: 0;
 +
}
 +
 
 +
ul#menu ol {
 +
  display: none;
 +
  text-align: right;
 +
  list-style-type: none;
 +
  margin: 0;
 +
  padding: 5px;
 +
}
 +
 
 +
ul#menu li,
 +
  ul#menu a {
 +
  font-family: verdana, sans-serif;
 +
  font-size: 11px;
 +
  color: #785a3c;
 +
}
 +
 
 +
ul#menu li {
 +
  border-bottom: solid 1px #b9a894;
 +
  line-height: 15px;
 +
}
 +
 
 +
ul#menu ol li {
 +
  border-bottom: none;
 +
}
 +
 
 +
ul#menu ol li:before {
 +
  content: "- ";
 +
}
 +
 
 +
ul#menu a {
 +
  text-decoration: none;
 +
  outline: none;
 +
}
 +
 
 +
ul#menu a:hover {
 +
  color: #539dbc;
 +
}
 +
 
 +
ul#menu a.active {
 +
  color: #be5028;
 +
}
 +
-->
 +
</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 = null;
 +
 
 +
function showMenu() {
 +
  if(activeMenu){
 +
    activeMenu.className = "";
 +
    getNextSiblingByElement(activeMenu).style.display = "none";
 +
  }
 +
  if(this == activeMenu){
 +
    activeMenu = null;
 +
  } else {
 +
    this.className = "active";
 +
    getNextSiblingByElement(this).style.display = "block";
 +
    activeMenu = this;
 +
  }
 +
  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(document.createElement) window.onload = initMenu;
 +
//-->
 +
</script>
 +
 
 +
 
 +
</head>
 +
<body>
 +
 
 +
 
 +
 
 +
<ul id="menu">
 +
  <li>Menu Item 1
 +
    <ol>
 +
      <li><a href="#">Sub Item 1.1</a></li>
 +
      <li><a href="#">Sub Item 1.2</a></li>
 +
      <li><a href="#">Sub Item 1.3</a></li>
 +
    </ol>
 +
  </li>
 +
  <li>Menu Item 2
 +
    <ol>
 +
      <li><a href="#">Sub Item 2.1</a></li>
 +
      <li><a href="#">Sub Item 2.2</a></li>
 +
      <li><a href="#">Sub Item 2.3</a></li>
 +
    </ol>
 +
  </li>
 +
  <li>Menu Item 3
 +
    <ol>
 +
      <li><a href="#">Sub Item 3.1</a></li>
 +
      <li><a href="#">Sub Item 3.2</a></li>
 +
      <li><a href="#">Sub Item 3.3</a></li>
 +
    </ol>
 +
  </li>
 +
  <li>Menu Item 4
 +
    <ol>
 +
      <li><a href="#">Sub Item 4.1</a></li>
 +
      <li><a href="#">Sub Item 4.2</a></li>
 +
      <li><a href="#">Sub Item 4.3</a></li>
 +
    </ol>
 +
  </li>
 +
  <li>Menu Item 5
 +
    <ol>
 +
      <li><a href="#">Sub Item 5.1</a></li>
 +
      <li><a href="#">Sub Item 5.2</a></li>
 +
      <li><a href="#">Sub Item 5.3</a></li>
 +
    </ol>
 +
  </li>
 +
</ul>
 +
 
 +
 
 +
<!--
<div id="menu">
<div id="menu">
Line 8: Line 204:
<ul>
<ul>
-
<li class="menu_header">Project</li>
+
<li class="menu_header">Project</li></ul>
<hr>
<hr>
<hr>
<hr>
-
<li>[[Team:Alberta/Project/Bioinformatics | '''Bio Informatics''']]</li>
+
 
-
<li>[[Team:Alberta/Project/Primer_Design | Primer Design]]</li>
+
<ul id="menu>>
 +
 
 +
<li>[[Team:Alberta/Project/Bioinformatics | '''Bioinformatics''']]
 +
<ol><li>[[Team:Alberta/Project/Primer_Design | Primer Design]]</li>
<li>[[Team:Alberta/Project/Promoters_&_Terminators | Promoters/Terminators]]</li>
<li>[[Team:Alberta/Project/Promoters_&_Terminators | Promoters/Terminators]]</li>
<li>[[Team:Alberta/Project/Modeling | Modeling]]</li>
<li>[[Team:Alberta/Project/Modeling | Modeling]]</li>
<li>[[Team:Alberta/Project/Gene_Selection | Gene Selection]]</li>
<li>[[Team:Alberta/Project/Gene_Selection | Gene Selection]]</li>
 +
</ol>
 +
</li>
 +
</ul>
 +
<hr>
<hr>
<hr>
<hr>
Line 38: Line 241:
</div>
</div>
 +
-->
 +
</body>
 +
 +
</html>

Revision as of 19:14, 26 August 2009

Retrieved from "http://2009.igem.org/Team:Alberta/LeftBar"