Team:Columbia-Cooper-NYC

From 2012.igem.org

(Difference between revisions)
Line 15: Line 15:
|}
|}
-->
-->
 +
<html>
<html>
 +
<head>
<head>
 +
<script>
 +
var TimeOut        = 300;
 +
var currentLayer    = null;
 +
var currentitem    = null;
 +
var currentLayerNum = 0;
 +
var noClose        = 0;
 +
var closeTimer      = null;
 +
function mopen(n) {
 +
  var l  = document.getElementById("menu"+n);
 +
  var mm = document.getElementById("mmenu"+n);
 +
 +
  if(l) {
 +
    mcancelclosetime();
 +
    l.style.visibility='visible';
 +
    if(currentLayer && (currentLayerNum != n))
 +
      currentLayer.style.visibility='hidden';
 +
    currentLayer = l;
 +
    currentitem = mm;
 +
    currentLayerNum = n;
 +
  } else if(currentLayer) {
 +
    currentLayer.style.visibility='hidden';
 +
    currentLayerNum = 0;
 +
    currentitem = null;
 +
    currentLayer = null;
 +
}
 +
}
 +
 +
function mclosetime() {
 +
  closeTimer = window.setTimeout(mclose, TimeOut);
 +
}
 +
 +
function mcancelclosetime() {
 +
  if(closeTimer) {
 +
    window.clearTimeout(closeTimer);
 +
    closeTimer = null;
 +
  }
 +
}
 +
 +
function mclose() {
 +
  if(currentLayer && noClose!=1)  {
 +
    currentLayer.style.visibility='hidden';
 +
    currentLayerNum = 0;
 +
    currentLayer = null;
 +
    currentitem = null;
 +
  } else {
 +
    noClose = 0;
 +
  }
 +
  currentLayer = null;
 +
  currentitem = null;
 +
}
 +
 +
document.onclick = mclose;
 +
</script>
 +
</head>
 +
 +
<body>
 +
<ul id="dd">
 +
  <li><a href="#" class="menu" id="mmenu1"
 +
      onmouseover="mopen(1);"
 +
      onmouseout="mclosetime();">Home</a>
 +
    <div class="submenu" id="menu1"
 +
      onmouseover="mcancelclosetime()"
 +
      onmouseout="mclosetime();">
 +
        <a href="#">HTML Tutorials</a>
 +
        <a href="#">DHTML Tutorials</a>
 +
        <a href="#">JavaScript Tutorials</a>
 +
        <a href="#">CSS Tutorials</a>
 +
    </div>
 +
  </li>
 +
  <li><a href="#" class="menu" id="mmenu2"
 +
      onmouseover="mopen(2);"
 +
      onmouseout="mclosetime();">Download</a>
 +
    <div class="submenu" id="menu2"
 +
      onmouseover="mcancelclosetime()"
 +
      onmouseout="mclosetime();">
 +
        <a href="#">ASP Scripts</a>
 +
        <a href="#">PHP Scripts</a>
 +
        <a href="#">Ajax Scripts</a>
 +
        <a href="#">Perl Scripts</a>
 +
    </div>
 +
  </li>
 +
  <li><a href="#" class="menu">Order</a></li>
 +
  <li><a href="#" class="menu">Help</a></li>
 +
  <li><a href="#" class="menu" id="mmenu3"
 +
      onmouseover="mopen(3);"
 +
      onmouseout="mclosetime();">Contact</a>
 +
    <div class="submenu" id="menu3"
 +
      onmouseover="mcancelclosetime()"
 +
      onmouseout="mclosetime();">
 +
        <a href="#">Office</a>
 +
        <a href="#">Sales</a>
 +
        <a href="#">Customer Service</a>
 +
        <a href="#">Shipping</a>
 +
    </div>
 +
  </li>
 +
</ul>
 +
</body>
 +
 +
<style type = "text/css">
 +
#dd {
 +
  margin-left: 25%;
 +
  padding: 0 0 20px 0;
 +
}
 +
 +
#dd li {
 +
  margin: 0;
 +
  padding: 0;
 +
  list-style: none;
 +
  float: left;
 +
  font: bold 11px arial;
 +
}
 +
 +
#dd li a.menu {
 +
  display: block;
 +
  text-align: center;
 +
  background: #5970B2;
 +
  padding: 4px 10px;
 +
  margin: 0 1px 0 0;
 +
  color: #FFF;
 +
  width: 60px;
 +
  text-decoration: none;
 +
}
 +
 +
#dd li a.menu:hover {
 +
  background: #49A3FF;
 +
}
 +
 +
.submenu {
 +
  background: #EAEBD8;
 +
  border: 1px solid #5970B2;
 +
  visibility: hidden;
 +
  position: absolute;
 +
  z-index: 3;
 +
}
 +
 +
.submenu a {
 +
  display: block;
 +
  font: 11px arial;
 +
  text-align: left;
 +
  text-decoration: none;
 +
  padding: 5px;
 +
  color: #2875DE;
 +
}
 +
 +
.submenu a:hover {
 +
  background: #49A3FF;
 +
  color: #FFF;
 +
}
 +
</style type = "text/css">
 +
 +
</html>
 +
 +
 +
 +
 +
 +
 +
<!--
 +
<html>
 +
<head>
<script>
<script>
Line 59: Line 221:
a.mO:active {color:#ffffff;}
a.mO:active {color:#ffffff;}
.mD {color:#cc9966; font:10px arial, Helvetica, sans-serif; background-color:#ffffff; visibility:hidden; margin:0; padding:0; position:absolute; z-index:1000; top:60px; left:0; width:125px; border-style:solid; border-width:0 1px 1px; border-color:#663300;}
.mD {color:#cc9966; font:10px arial, Helvetica, sans-serif; background-color:#ffffff; visibility:hidden; margin:0; padding:0; position:absolute; z-index:1000; top:60px; left:0; width:125px; border-style:solid; border-width:0 1px 1px; border-color:#663300;}
 +
</style>
</html>
</html>
-
 
+
-->

Revision as of 22:00, 16 August 2012