Template:Team:Bonn:PageMenu

From 2013.igem.org

(Difference between revisions)
(Blanked the page)
 
(220 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
 
-
<script type="text/javascript">
 
-
$(function(){
 
-
    $(".igemMenu").buildMenu({
 
-
          additionalData:"",
 
-
          menuSelector:".menuContainer",
 
-
          menuWidth:150,
 
-
          openOnRight:false,
 
-
          containment:"window",
 
-
          iconPath:"ico/",
 
-
          hasImages:true,
 
-
          fadeInTime:100,
 
-
          fadeOutTime:200,
 
-
          menuTop:0,
 
-
          menuLeft:0,
 
-
          submenuTop:0,
 
-
          submenuLeft:4,
 
-
          opacity:1,
 
-
          shadow:false,
 
-
          shadowColor:"black",
 
-
          shadowOpacity:.2,
 
-
          openOnClick:false,
 
-
          closeOnMouseOut:false,
 
-
          closeAfter:500,
 
-
          minZindex:"auto",
 
-
          hoverIntent:0, //if you use jquery.hoverIntent.js set this to time in milliseconds; 0= false;
 
-
          submenuHoverIntent:0, //if you use jquery.hoverIntent.js set this to time in milliseconds; 0= false;
 
-
      });
 
-
  });
 
-
</script>
 
-
<style>
 
-
.mbmenu{
 
-
  display:none;
 
-
}
 
-
.rootVoices{
 
-
  padding-bottom:0;
 
-
  background: transparent;
 
-
}
 
-
 
-
.rootVoices td.rootVoice {
 
-
  vertical-align:middle;
 
-
/*background-color:#fff;*/
 
-
  width:120px;
 
-
  font-family:Arial,Helvetica,sans-serif;
 
-
  text-shadow:#fff 1px 1px 1px; 
 
-
  color: gray;
 
-
  font-size:14px;
 
-
  line-height:18px;
 
-
  padding:8px 64px;
 
-
  cursor: pointer;
 
-
}
 
-
 
-
.rootVoices td.rootVoice.selected{
 
-
  background: black url("../images/bgnd_sel_4.png");
 
-
  padding:8px 64px;
 
-
  color:#ffffff;
 
-
  cursor: pointer;
 
-
  font-size:14px;
 
-
  text-shadow:#660033 1px 1px 1px;
 
-
  /*
 
-
    -moz-box-shadow:#999 2px 2px 10px;
 
-
    -webkit-box-shadow:#999 2px 2px 10px;
 
-
  */
 
-
  -moz-border-radius:8px 8px 0 0px;
 
-
  -webkit-border-top-right-radius:8px;
 
-
  -webkit-border-top-left-radius:8px;
 
-
  -webkit-border-bottom-right-radius:0px;
 
-
  -webkit-border-bottom-left-radius:0px;
 
-
 
-
}
 
-
.rootVoices td.rootVoice.disabled.selected{
 
-
  background:#999!important;
 
-
  color:#666;
 
-
  text-shadow:#ddd 1px 1px 1px;
 
-
}
 
-
 
-
/**/
 
-
 
-
.menuContainer{
 
-
/*overflow:hidden;*/
 
-
  position:absolute;
 
-
  background-color:gray;
 
-
  border-top:5px solid black;
 
-
  padding:0;
 
-
  -moz-box-shadow:#999 2px 2px 10px;
 
-
  -webkit-box-shadow:#999 2px 2px 10px;
 
-
  box-shadow:#999 2px 2px 10px;
 
-
  -moz-border-radius: 0 0 8px 8px;
 
-
  -webkit-border-top-right-radius:0px;
 
-
  -webkit-border-top-left-radius:0px;
 
-
  -webkit-border-bottom-right-radius:8px;
 
-
  -webkit-border-bottom-left-radius:8px;
 
-
}
 
-
.menuContainer.submenuContainer{
 
-
  border-top:none!important;
 
-
}
 
-
 
-
.menuContainer.disabled{
 
-
  border-top:5px solid #999;
 
-
  background-color:gray;
 
-
}
 
-
.menuContainer .line{
 
-
  background-color:transparent;
 
-
  width:100%;
 
-
}
 
-
.menuContainer .line.title {
 
-
  background-color:black;
 
-
  font-family:Arial,Helvetica,sans-serif;
 
-
  font-size:14px;
 
-
/*border-bottom:1px solid black;*/
 
-
}
 
-
.menuContainer.disabled .line.title {
 
-
  background-color:#999;
 
-
}
 
-
.menuContainer .line.title a{
 
-
  font-size:14px;
 
-
  color:#ccc;
 
-
}
 
-
.menuContainer.disabled .line.title a{
 
-
  font-size:14px;
 
-
  color:#666;
 
-
  text-shadow:#999 1px 1px 1px;
 
-
}
 
-
.menuContainer td a{
 
-
  text-decoration:none;
 
-
  color:#f3f3f3;
 
-
  text-shadow:#666 1px 1px 1px;
 
-
}
 
-
.menuContainer td.voice{
 
-
  font-family:Arial,Helvetica,sans-serif;
 
-
  font-size:14px;
 
-
  padding:7px;
 
-
}
 
-
.menuContainer .separator{
 
-
  background-color:#999;
 
-
  height:1px;
 
-
  padding:0;
 
-
  margin:0;
 
-
}
 
-
.menuContainer td.img{
 
-
  font-family:Arial,Helvetica,sans-serif;
 
-
  text-align:center;
 
-
  font-size:12px;
 
-
  color: #c3c3c3;
 
-
  background-color:transparent;
 
-
  width:24px;
 
-
  padding:5px;
 
-
}
 
-
.menuContainer td.img img{
 
-
  width:20px;
 
-
}
 
-
.menuContainer .textBox{
 
-
  padding: 10px;
 
-
  font-family:Arial,Helvetica,sans-serif;
 
-
  font-size:12px;
 
-
  color: #c3c3c3;
 
-
}
 
-
.menuContainer .selected td{
 
-
  background-color:#f3f3f3;
 
-
  background-image:url("../images/bgnd_sel_2.jpg")
 
-
}
 
-
.menuContainer .selected td a{
 
-
  color:#000;
 
-
  text-shadow:#fff 2px 2px 1px;
 
-
  display:block;
 
-
}
 
-
.menuContainer .disabled td, .menuContainer .disabled td a {
 
-
  color:#555;
 
-
  text-shadow:#999 1px 1px 1px;
 
-
}
 
-
.menuContainer .subMenuOpener{
 
-
  background-image:url("../images/menuArrow_w.gif");
 
-
  background-repeat:no-repeat;
 
-
  background-position:right;
 
-
}
 
-
.menuContainer .selected .subMenuOpener{
 
-
  background-image:url("../images/menuArrow.gif");
 
-
  background-repeat:no-repeat;
 
-
  background-position:right;
 
-
}
 
-
 
-
</style>
 
-
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/mbMenu.js"></script>
 
-
 
-
<table  border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" class="container">
 
-
      <tr>
 
-
        <td class="igemMenu">
 
-
 
-
          <!-- start horizontal menu -->
 
-
 
-
          <table class="rootVoices" cellspacing='0' cellpadding='0' border='0'><tr>
 
-
            <td class="rootVoice {menu: 'empty'}" onclick="window.open ('https://2013.igem.org/Team:Bonn','_self',false)">Home</td>
 
-
            <td class="rootVoice {menu: 'menu_team'}">Team</td>
 
-
            <td class="rootVoice {menu: 'empty'}" onclick="alert('Hey, we need to write this!')">Introduction</td>
 
-
            <td class="rootVoice {menu: 'empty'}" onclick="alert('Hey, we need to write this!')">Project</td>
 
-
            <td class="rootVoice {menu: 'empty'}" onclick="alert('Hey, we need to write this!')">Human Practice</td>
 
-
          </tr></table>
 
-
 
-
          <!-- end horizontal menu -->
 
-
 
-
        </td>
 
-
      </tr>
 
-
</table>
 
-
 
-
 
-
<div id="menu_team" class="mbmenu">
 
-
    <a rel="title" >Our Team</a>
 
-
    <a href="#" class="{img: 'some_nice_igem_image.png'}" >About Us</a>
 
-
    <a href="https://igem.org/Team.cgi?year=2013&team_name=Bonn" class="{img: 'some_nice_igem_image.png'}" >Official Profile</a>
 
-
    <a href="#" class="{img: 'some_nice_igem_image.png'}" >Sponsors</a>
 
-
    <a href="#" class="{img: 'some_nice_igem_image.png'}" >Acknowledgements</a>
 
-
   
 
-
    <a rel="separator"> </a> <!-- menuvoice separator-->
 
-
 
-
    <a href="#" class="{img: 'some_nice_igem_image.png'}" >Bonn</a>
 
-
</div>
 
-
 
-
<!--
 
-
<div class="menu">
 
-
<ul id="menu-top">
 
-
  <li id="menu-1" class="menu-column">
 
-
      <div id="menu-home" class="menu-head"></html> [[Team:Bonn|Home]] <html></div>
 
-
  </li>
 
-
  <li id="menu-2" class="menu-column">
 
-
    <div class="menu-head"></html> Team <html></div>
 
-
    <ul class="menu-sub-ul" id="menu-sub-team">
 
-
      <li class="menu-sub" id="menu-team-aboutus">
 
-
        </html> About Us <html>
 
-
      </li>
 
-
      <li class="menu-sub" id="menu-team-officialprofile">
 
-
        </html> [https://igem.org/Team.cgi?year=2013&team_name=Bonn Official Profile] <html>
 
-
      </li>
 
-
      <li class="menu-sub" id="menu-team-sponsors">
 
-
        </html> Sponsors <html>
 
-
      </li>
 
-
      <li class="menu-sub" id="menu-team-sponsors">
 
-
        </html> Acknowledgements<html>
 
-
      </li>
 
-
      <li class="menu-sub" id="menu-team-sponsors">
 
-
        </html> Bonn <html>
 
-
      </li>
 
-
    </ul>
 
-
  </li>
 
-
  <li id="menu-3" class="menu-column">
 
-
    <div class="menu-head"></html> Introduction <html></div>
 
-
    <ul class="menu-sub-ul" id="menu-sub-intro">
 
-
    </ul>
 
-
  </li>
 
-
  <li id="menu-4" class="menu-column">
 
-
    <div class="menu-head"></html> Project <html></div>
 
-
    <ul class="menu-sub-ul" id="menu-sub-project">
 
-
    </ul>
 
-
  </li>  <li id="menu-5" class="menu-column">
 
-
    <div class="menu-head"></html> Human Practice <html></div>
 
-
    <ul class="menu-sub-ul" id="menu-sub-hp">
 
-
    </ul>
 
-
  </li>
 
-
 
-
</ul>
 
-
</div>
 
-
<script>
 
-
for(var m,m=1; m<3;m++) {
 
-
  dropdown("menu-"+m);
 
-
}
 
-
</script>
 
-
-->
 
-
</html>
 

Latest revision as of 05:17, 26 September 2013