Template:Team:MSOE

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<HTML>
<HTML>
-
<HEAD>
+
<HEAD>
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
+
<link rel="stylesheet" type="text/css" href="http://www.dynamicdrive.com/dynamicindex1/mouseovertabs.css" />
-
<script src="http://www.dynamicdrive.com/dynamicindex1/gooeymenu.js">
+
<script src="http://www.dynamicdrive.com/dynamicindex1/mouseovertabs.js" type="text/javascript">
/***********************************************
/***********************************************
-
* Gooey Menu Script (c) Dynamic Drive (www.dynamicdrive.com)
+
* Mouseover Tabs Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* This notice MUST stay intact for legal use
-
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
+
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
***********************************************/
</script>
</script>
-
 
+
</HEAD>
-
<style>
+
<BODY>
-
hr{
+
<div id="mytabsmenu" class="tabsmenuclass">
-
margin:50px 0;
+
<ul>
-
color:#eee;
+
<li><a href="http://www.javascriptkit.com" rel="gotsubmenu[selected]">JavaScript Kit</a></li>
-
}
+
<li><a href="http://www.cssdrive.com" rel="gotsubmenu">CSS Drive</a></li>
-
 
+
<li><a href="http://www.codingforums.com">No Sub Menu</a></li>
-
ul li.active{ /*IE6 hack- hide gooey effect from that browser*/
+
-
_visibility: hidden; /*IE6 rule*/
+
-
}
+
-
 
+
-
/* ######### Gel Menu CSS ######### */
+
-
 
+
-
ul.gelbuttonmenu{
+
-
position:relative;
+
-
padding: 0;
+
-
margin: 0;
+
-
margin-bottom:1em;
+
-
text-align: center; //set value to "left", "center", or "right"*/
+
-
}
+
-
 
+
-
ul.gelbuttonmenu li{
+
-
display: inline;
+
-
}
+
-
 
+
-
ul.gelbuttonmenu li a{
+
-
color: black;
+
-
font-weight:bold;
+
-
padding: 10px; /*make sure padding is sufficient that the height of the link is enough to fully show the gel button*/
+
-
margin-right: 20px; /*spacing between each menu link*/
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
ul.gelbuttonmenu li.active{ /*style of LI that gets dynamically added to menu to create background effect*/
+
-
position:absolute;
+
-
width:0;
+
-
background:lightblue;
+
-
background:url(http://www.dynamicdrive.com/dynamicindex1/gelbuttonleft.gif) top left no-repeat, url(https://static.igem.org/mediawiki/2013/e/e6/Gelbuttonright.gif) top right no-repeat, url(https://static.igem.org/mediawiki/2013/6/65/Gelbuttoncenter.gif) top center repeat-x;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/* ######### Solid Block Menu CSS ######### */
+
-
 
+
-
 
+
-
ul.solidblockmenu{
+
-
margin: 0;
+
-
margin-bottom:1em;
+
-
padding: 0;
+
-
list-style: none;
+
-
position:relative;
+
-
text-align: center; //set value to "left", "center", or "right"*/
+
-
}
+
-
 
+
-
ul.solidblockmenu li{
+
-
display: inline;
+
-
}
+
-
 
+
-
ul.solidblockmenu li a{
+
-
font: bold 14px Arial, Verdana, sans-serif;
+
-
color: black;
+
-
padding: 8px;
+
-
margin-right: 20px; /*spacing between each menu link*/
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
ul.solidblockmenu li.active{ /*style of LI that gets dynamically added to menu to create background effect*/
+
-
position:absolute;
+
-
width:0;
+
-
border:1px solid black;
+
-
-moz-border-radius: 4px;
+
-
-webkit-border-radius: 4px;
+
-
border-radius:4px;
+
-
-moz-box-shadow: 2px 2px 4px rgba(120,120,120,0.7);
+
-
-webkit-box-shadow: 2px 2px 4px rgba(120,120,120,0.7);
+
-
box-shadow: 2px 2px 4px rgba(120,120,120,0.7);
+
-
background:#d7ed93;
+
-
background: -moz-linear-gradient(top, #d7ed93, #fff);
+
-
background: -webkit-gradient(linear, center top, center bottom, from(#d7ed93), to(#fff));
+
-
background: linear-gradient(top, #d7ed93, #fff);
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/* ######### Thick Underline Menu CSS ######### */
+
-
 
+
-
 
+
-
ul.underlinemenu{
+
-
margin: 0;
+
-
margin-bottom:1em;
+
-
padding: 0;
+
-
list-style: none;
+
-
position:relative;
+
-
text-align: center; //set value to "left", "center", or "right"*/
+
-
}
+
-
 
+
-
ul.underlinemenu li{
+
-
display: inline;
+
-
}
+
-
 
+
-
ul.underlinemenu li a{
+
-
font: bold 14px Arial, Verdana, sans-serif;
+
-
color: black;
+
-
padding: 8px;
+
-
margin-right: 20px; /*spacing between each menu link*/
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
 
+
-
ul.underlinemenu li.active{ /*style of LI that gets dynamically added to menu to create background effect*/
+
-
position:absolute;
+
-
width:0;
+
-
border-bottom:5px solid navy;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/* ######### Frame Menu CSS ######### */
+
-
 
+
-
 
+
-
ul.framemenu{
+
-
margin: 0;
+
-
margin-bottom:1em;
+
-
padding: 0;
+
-
list-style: none;
+
-
position:relative;
+
-
text-align: center; //set value to "left", "center", or "right"*/
+
-
}
+
-
 
+
-
ul.framemenu li{
+
-
display: inline;
+
-
}
+
-
 
+
-
ul.framemenu li a{
+
-
font: bold 14px Arial, Verdana, sans-serif;
+
-
color: black;
+
-
padding: 12px 10px 5px 18px;
+
-
margin-right: 10px; /*spacing between each menu link*/
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
 
+
-
ul.framemenu li.active{ /*style of LI that gets dynamically added to menu to create background effect*/
+
-
position:absolute;
+
-
width:0;
+
-
border:4px solid orange;
+
-
-moz-box-shadow: 0 0 4px rgba(120,120,120,0.7);
+
-
-webkit-box-shadow: 0 0 4px rgba(120,120,120,0.7);
+
-
box-shadow: 0 0 4px rgba(120,120,120,0.7);
+
-
}
+
-
</style>
+
-
</HEAD>
+
-
<BODY>
+
-
<ul id="gooeymenu1" class="gelbuttonmenu">
+
-
<li><a href="http://www.dynamicdrive.com/">Home</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/style/">CSS Codes</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
+
-
<li><a href="http://tools.dynamicdrive.com">Tools</a></li>
+
-
<li><a href="http://www.javascriptkit.com/" class="selected">JavaScript</a></li>
+
-
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
+
</ul>
</ul>
 +
</div>
-
<script>
+
<div id="mysubmenuarea" class="tabsmenucontentclass">
-
gooeymenu.setup({id:'gooeymenu1', selectitem:1})
+
-
</script>
+
 +
<!--1st link within submenu container should point to the external submenu contents file-->
 +
<a href="submenucontents.htm" style="visibility:hidden">Sub Menu contents</a>
 +
</div>
-
<hr />
+
<script type="text/javascript">
 +
//mouseovertabsmenu.init("tabs_container_id", "submenu_container_id", "bool_hidecontentsmouseout")
 +
mouseovertabsmenu.init("mytabsmenu", "mysubmenuarea", true)
-
<ul id="gooeymenu2" class="solidblockmenu">
 
-
<li><a href="http://www.dynamicdrive.com/">Home</a></li>
 
-
<li><a href="http://www.dynamicdrive.com/style/">CSS Codes</a></li>
 
-
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
 
-
<li><a href="http://tools.dynamicdrive.com">Tools</a></li>
 
-
<li><a href="http://www.javascriptkit.com/">JavaScript</a></li>
 
-
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
 
-
</ul>
 
-
 
-
<script>
 
-
gooeymenu.setup({id:'gooeymenu2', selectitem:1, fx:'swing'})
 
</script>
</script>
-
 
+
</BODY>
-
 
+
-
 
+
-
 
+
-
<hr />
+
-
 
+
-
<ul id="gooeymenu3" class="underlinemenu">
+
-
<li><a href="http://www.dynamicdrive.com/">Home</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/style/">CSS Codes</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
+
-
<li><a href="http://tools.dynamicdrive.com">Tools</a></li>
+
-
<li><a href="http://www.javascriptkit.com/" class="selected">JavaScript</a></li>
+
-
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
+
-
</ul>
+
-
 
+
-
<script>
+
-
gooeymenu.setup({id:'gooeymenu3', fxtime:250})
+
-
</script>
+
-
 
+
-
 
+
-
 
+
-
 
+
-
<hr />
+
-
 
+
-
<ul id="gooeymenu4" class="framemenu">
+
-
<li><a href="http://www.dynamicdrive.com/">Home</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/style/">CSS Codes</a></li>
+
-
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
+
-
<li><a href="http://tools.dynamicdrive.com">Tools</a></li>
+
-
<li><a href="http://www.javascriptkit.com/">JavaScript</a></li>
+
-
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
+
-
</ul>
+
-
 
+
-
<script>
+
-
gooeymenu.setup({id:'gooeymenu4', snapdelay:500})
+
-
</script>
+
-
 
+
-
</BODY>
+
</HTML>
</HTML>

Revision as of 19:03, 18 June 2013

Retrieved from "http://2013.igem.org/Template:Team:MSOE"