Template:Team:Bonn:PageMenu

From 2013.igem.org

(Difference between revisions)
(First pieces of new menu)
Line 2: Line 2:
<script type="text/javascript">
<script type="text/javascript">
jQuery(function(){
jQuery(function(){
-
jQuery('ul.sf-menu').superfish();
+
jQuery('ul.igem13-menu').superfish();
});
});
</script>
</script>
-
<style>
+
<ul class="igem13-menu">
-
table, tr, td {background:transparent; border:0px;}
+
<li><a href="https://2013.igem.org/Team:Bonn"><img src="https://static.igem.org/mediawiki/2013/a/ab/Bonn_Top_Logo_LOVWARS.png" height="50px"/></a></li>
-
table table table {background:transparent;}
+
-
table table table td {background-color:transparent;}
+
-
.mbmenu{
+
<li><a href="https://2013.igem.org/Team:Bonn/Introduction/"><img src="https://static.igem.org/mediawiki/igem.org/b/b5/Bonn_menu_introduction.png" height="20px"/></a></li>
-
  display:none;
+
-
}
+
-
.top-logo {
+
-
padding: 0 0 30px 0;
+
-
}
+
-
.top-logo img{
+
-
border: 5px solid rgb(255,225,40);
+
-
padding:4px;
+
-
  -moz-border-radius : 2px; /* Firefox */
+
-
  -webkit-border-radius : 2px; /* Safari & Chrome */
+
-
  -khtml-border-radius : 2px; /* Linux browsers */
+
-
  border-radius : 2px; /* CSS3 compatible browsers */
+
-
}
+
-
.rootVoices{
+
-
width:1250px;
+
-
  padding-bottom:0;
+
-
  margin-top:-20px;
+
-
  background: transparent;
+
-
  border-spacing: 42px 0;
+
-
  margin-left:-190px;
+
-
  background-repeat: no-repeat;
+
-
  background-position:left;
+
-
  position:relative;
+
-
  padding-right:100px;
+
-
}
+
-
.rootVoices td.rootVoice {
+
-
  width:120px;
+
-
  font-family:Arial,Helvetica,sans-serif;
+
-
  text-shadow:#fff 1px 1px 1px;
+
-
  color: gray;
+
-
  font-size:14px;
+
-
  line-height:18px;
+
-
  text-align: center;
+
-
  vertical-align: middle;
+
-
  padding:8px;
+
-
  cursor: pointer;
+
-
  margin: 10px;
+
-
  -moz-border-radius : 12px; /* Firefox */
+
-
  -webkit-border-radius : 12px; /* Safari & Chrome */
+
-
  -khtml-border-radius : 12px; /* Linux browsers */
+
-
  border-radius : 12px; /* CSS3 compatible browsers */
+
-
  border-style: solid;
+
-
}
+
-
.rootVoices td:hover{
+
-
}
+
-
.rootVoices td.rootVoice.selected{
+
<li><a href="https://2013.igem.org/Team:Bonn/Project/"><img src="https://static.igem.org/mediawiki/igem.org/2/2a/Bonn_menu_project.png" height="20px"/></a></li>
-
  padding:8px;
+
-
  color:#ffffff;
+
-
  cursor: pointer;
+
-
  font-size:14px;
+
-
  /*
+
-
    -moz-box-shadow:#999 2px 2px 10px;
+
-
    -webkit-box-shadow:#999 2px 2px 10px;
+
-
  */
+
-
}
+
-
.rootVoices td.rootVoice.disabled.selected{
+
-
  background:#999!important;
+
-
  color:#666;
+
-
}
+
-
/**/
+
<li>
 +
<a href="https://2013.igem.org/Team:Bonn/HP/"><img src="https://static.igem.org/mediawiki/igem.org/2/2a/Wiki_humanpractice.png" height="20px"/></a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:Bonn/HP/">Overview</a></li>
 +
<li><a href="https://2013.igem.org/Team:Bonn/HP/comic">Comic</a></li>
 +
<li><a href="https://2013.igem.org/Team:Bonn/HP/game">LOV-Wars Shooter</a></li>
 +
<li><a href="https://2013.igem.org/Team:Bonn/HP/slam">ScienceSlam</a></li>
 +
<li><a href="https://2013.igem.org/Team:Bonn/HP/school">School visits</a></li>
 +
</ul>
 +
</li>
-
.menuContainer{
 
-
  position:absolute;
 
-
  padding: 50px 0 0 0;
 
-
  width:170px;
 
-
  background-color:#F7FF35;
 
-
  opacity: 0.6;
 
-
  font-weight:bold;
 
-
  text-align:left;
 
-
  top:-50px;
 
-
  -moz-border-radius : 3px;
 
-
  -webkit-border-radius : 3px;
 
-
  -khtml-border-radius : 3px;
 
-
  border-radius : 3px;
 
-
  color: #666666;
 
-
  z-index:1;
 
-
}
 
-
.menu_main_pic{
 
-
z-index:5;
 
-
}
 
-
.menu_sub {
 
-
-webkit-box-shadow: 0 0 4px rgba(255, 255, 255, 0.2);
+
<li>
-
-moz-box-shadow: 0 0 4px rgba(255, 255, 255, 0.2));
+
<a href="https://2013.igem.org/Team:Bonn/Team/about"><img src="https://static.igem.org/mediawiki/igem.org/5/5f/Wiki_Team.png" height="20px"/></a>
-
box-shadow: 0 0 5px rgba(255, 255, 255, 0.2);
+
<ul>
-
  color: #666666;
+
<li><a href="https://2013.igem.org/Team:Bonn/Team/about">About us</a></li>
-
}
+
<li><a href="https://igem.org/Team.cgi?year=2013&team_name=Bonn">Official Profile</a></li>
-
.menuContainer.submenuContainer{
+
<li><a href="https://2013.igem.org/Team:Bonn/Team/sponsors">Sponsors</a></li>
-
  border-top:none!important;
+
<li><a href="https://2013.igem.org/Team:Bonn/Team/acknowledgements">Acknowledgements</a></li>
-
  color: #666666;
+
-
}
+
-
.menuContainer.disabled{
+
<li><a href="https://2013.igem.org/Team:Bonn/Team/bonn">Bonn</a></li>
-
  border-top:5px solid #999;
+
</ul>
-
  background-color:gray;
+
</li>
-
  color: #666666;
+
-
}
+
-
.menuContainer .line{
+
-
  background-color:transparent;
+
-
  width:100%;
+
-
  color: #666666;
+
-
}
+
-
.menuContainer .line.title {
+
-
  font-family:Arial,Helvetica,sans-serif;
+
-
  font-size:14px;
+
-
/*border-bottom:1px solid black;*/
+
-
  color: #666666;
+
-
}
+
-
.menuContainer.disabled .line.title {
+
-
  background-color:#999;
+
-
}
+
-
.menuContainer .line.title a{
+
-
  font-size:14px;
+
-
}
+
-
.menuContainer.disabled .line.title a{
+
-
  font-size:14px;
+
-
}
+
-
.menuContainer td a{
+
-
  text-decoration:none;
+
-
  color: #666666;
+
-
}
+
-
.menuContainer td.voice{
+
-
  font-family:Arial,Helvetica,sans-serif;
+
-
  font-size:14px;
+
-
  padding:7px;
+
-
  color: #666666;
+
-
}
+
-
.menuContainer .separator{
+
-
  height:1px;
+
-
  padding:0;
+
-
  margin:0;
+
-
}
+
-
.menuContainer td.img{
+
-
  font-family:Arial,Helvetica,sans-serif;
+
-
  text-align:center;
+
-
  font-size:12px;
+
-
  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;
+
-
}
+
-
.menuContainer .selected td{
+
-
  background-color:#939393;
+
-
  background-image:url("../images/bgnd_sel_2.jpg")
+
-
  font-weight: bold;
+
-
}
+
-
.menuContainer .selected td a{
+
-
  color:#000;
+
-
  display:block;
+
-
  font-weight: bold;
+
-
}
+
-
.menuContainer .disabled td, .menuContainer .disabled td a {
+
-
  color:#555;
+
-
  font-weight: bold;
+
-
}
+
-
.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">
+
-
      <tr>
+
-
        <td class="igemMenu">
+
-
 
+
-
          <!-- start horizontal menu -->
+
-
 
+
-
          <table class="rootVoices" cellspacing='0' cellpadding='0' border='0'><tr>
+
-
            <td class="top-logo" onclick="window.open ('https://2013.igem.org/Team:Bonn','_self',false)"> <div class="menu_main_pic"><img src="https://static.igem.org/mediawiki/2013/a/ab/Bonn_Top_Logo_LOVWARS.png" height="50px" ></div></td>
+
-
            <td class="rootVoice {menu: 'menu_background'}"><div class="menu_main"><a href="https://2013.igem.org/Team:Bonn/Introduction/"><img src="https://static.igem.org/mediawiki/igem.org/b/b5/Bonn_menu_introduction.png" height="20px"></div></td>
+
-
            <td class="rootVoice {menu: 'menu_project'}"><div class="menu_main"><a href="https://2013.igem.org/Team:Bonn/Project/"><img src="https://static.igem.org/mediawiki/igem.org/2/2a/Bonn_menu_project.png" height="20px"></div></td>
+
-
            <td class="rootVoice {menu: 'menu_HP'}"><div class="menu_main"><a href="https://2013.igem.org/Team:Bonn/HP/"><img src="https://static.igem.org/mediawiki/igem.org/2/2a/Wiki_humanpractice.png" height="20px"></div></td>
+
-
            <td class="rootVoice {menu: 'menu_team'}"><div class="menu_main"><a href="https://2013.igem.org/Team:Bonn/team/aboutus/"><img src="https://static.igem.org/mediawiki/igem.org/5/5f/Wiki_Team.png" height="20px"></a></div></td>
+
-
          </tr></table>
+
-
 
+
-
          <!-- end horizontal menu -->
+
-
 
+
-
        </td>
+
-
      </tr>
+
-
</table>
+
-
 
+
-
<! Team Dropdown>
+
-
<div id="menu_team" class="mbmenu">
+
-
    <div id="menu_team_sub" class="menu_sub">
+
-
    <a href="https://2013.igem.org/Team:Bonn/team/aboutus/" 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="https://2013.igem.org/Team:Bonn/team/sponsors/" class="{img: 'some_nice_igem_image.png'}" >Sponsors</a>
+
-
    <a href="https://2013.igem.org/Team:Bonn/team/acknowledgements/" class="{img: 'some_nice_igem_image.png'}" >Acknowledgements</a>
+
-
 
+
-
    <a rel="separator"> </a> <!-- menuvoice separator-->
+
-
 
+
-
    <a href="https://2013.igem.org/Team:Bonn/team/bonn/" class="{img: 'some_nice_igem_image.png'}" >Bonn</a>
+
-
    </div>
+
-
</div>
+
-
 
+
-
<! Human Practice Dropdown>
+
-
<div id="menu_HP" class="mbmenu">
+
-
    <div id="menu_HP_sub" class="menu_sub">
+
-
<a href="https://2013.igem.org/Team:Bonn/HP/" class="{img: 'some_nice_igem_image.png'}" >Overview</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/HP/comic/" class="{img: 'some_nice_igem_image.png'}" >Comic</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/HP/game/" class="{img: 'some_nice_igem_image.png'}" >LOV-Wars Shooter</a>
+
-
<a href="https://2013.igem.org/Team:Bonn/HP/slam/" class="{img: 'some_nice_igem_image.png'}" >ScienceSlam</a>
+
-
<a href="https://2013.igem.org/Team:Bonn/HP/school/" class="{img: 'some_nice_igem_image.png'}" >School visits</a>
+
-
+
-
    <a rel="separator"> </a> <!-- menuvoice separator-->
+
-
 
+
-
  </div>
+
-
</div>
+
-
 
+
-
<! Project Dorpdown>
+
-
<div id="menu_project" class="mbmenu">
+
-
    <div id="menu_project_sub" class="menu_sub">
+
-
<a href="https://2013.igem.org/Team:Bonn/Project/" class="{img: 'some_nice_igem_image.png'}" >Overview</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Project/Reporter/" class="{img: 'some_nice_igem_image.png'}" >Reporter</a>
+
-
<a href="https://2013.igem.org/Team:Bonn/Project/PDegrad/" class="{img: 'some_nice_igem_image.png'}" >Protein Degradation</a>
+
-
<a href="https://2013.igem.org/Team:Bonn/Project/LIExpress/" class="{img: 'some_nice_igem_image.png'}" >Light Induced Expression</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Project/LIPDegrad" class="{img: 'some_nice_igem_image.png'}" >Light Inducable Degradation</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Project/Modelling/" class="{img: 'some_nice_igem_image.png'}" >Modelling</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Project/Notebook/" class="{img: 'some_nice_igem_image.png'}" >Notebook</a>
+
-
 
+
-
    <a rel="separator"> </a> <!-- menuvoice separator-->
+
-
 
+
-
  </div>
+
-
</div>
+
-
 
+
-
<! Background>
+
-
<div id="menu_background" class="mbmenu">
+
-
    <div id="menu_background_sub" class="menu_sub">
+
-
<a href="https://2013.igem.org/Team:Bonn/Introduction/" class="{img: 'some_nice_igem_image.png'}" >Introduction</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Introduction/PDegrad/" class="{img: 'some_nice_igem_image.png'}" >Protein degradation</a>
+
-
        <a href="https://2013.igem.org/Team:Bonn/Introduction/LightInd/" class="{img: 'some_nice_igem_image.png'}" >Light induction</a>
+
-
 
+
-
+
-
 
+
-
    <a rel="separator"> </a> <!-- menuvoice separator-->
+
-
 
+
-
  </div>
+
-
</div>
+
 +
</ul>
</html>
</html>

Revision as of 21:47, 22 June 2013