Team:UT-Tokyo/Templates/BeginContent

From 2011.igem.org

(Difference between revisions)
m
(updated menu structure)
Line 273: Line 273:
   z-index: 999;
   z-index: 999;
}
}
-
 
#navi #menu #hauptMenu {
#navi #menu #hauptMenu {
/* background: #333 url(gradation.png) no-repeat scroll left top;*/
/* background: #333 url(gradation.png) no-repeat scroll left top;*/
Line 283: Line 282:
top: 0;
top: 0;
left: 0;
left: 0;
 +
}
 +
 +
#navi #menu .subMenu {
 +
  width: 220px;
 +
  position: absolute;
 +
  left: 160px;
 +
  background-image: url(http://igem-ut.net/2011/trans.png);
 +
  background-repeat: repeat;
 +
  display: none;
 +
}
 +
 +
#navi #menu #teamMenu {
 +
  top: 25px;
 +
  height: 70px;
}
}
#navi #menu #projectMenu {
#navi #menu #projectMenu {
-
   width: 300px;
+
   top: 15px;
 +
  height: 150px; 
 +
}
 +
 
 +
#navi #menu #dataMenu {
 +
  top: 45px;
   height: 120px;
   height: 120px;
 +
}
 +
 +
#navi #menu #societyMenu {
 +
  top: 105px;
 +
  height: 70px;
 +
}
 +
 +
#navi #menu .subMenu img {
   position: absolute;
   position: absolute;
-
  top: 25px;
+
   left: -25px;
-
   left: 200px;
+
-
  background-image: url(http://igem-ut.net/2011/projectMenuBg.png);
+
-
  background-repeat: no-repeat;
+
-
  display: none;
+
}
}
-
#navi #menu #projectMenu #projectMenu1 {
+
#navi #menu #teamMenu img {top: 13px;}
 +
#navi #menu #projectMenu img {top: 60px;}
 +
#navi #menu #dataMenu img {top: 64px;}
 +
#navi #menu #societyMenu img {top: 43px;}
 +
 
 +
#navi #menu .subMenu ul {
   position: absolute;
   position: absolute;
   top: 6px;
   top: 6px;
   left: 10px;
   left: 10px;
-
}
 
-
#navi #menu #projectMenu #projectMenu2 {
 
-
  position: absolute;
 
-
  top: 6px;
 
-
  left: 140px;
 
}
}
Line 312: Line 334:
#navi #menu ul li {
#navi #menu ul li {
-
   font: 500 18px "Maven Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
+
   font: 500 20px "Maven Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
   list-style: none;
   list-style: none;
   display: block;
   display: block;
-
   width: 180px;
+
   width: 110px;
   height: 23px;
   height: 23px;
   line-height: 27px;
   line-height: 27px;
Line 324: Line 346:
#navi #menu ul li a{
#navi #menu ul li a{
   color: #fff;
   color: #fff;
-
  width: 180px;
 
   display: block;
   display: block;
   text-decoration: none;
   text-decoration: none;
 +
  vertical-align: middle;
}
}
-
#navi #menu #projectMenu ul li {
+
#navi #menu ul li.active, #navi #menu ul li.hover {
 +
  background-image: url(http://igem-ut.net/2011/trans.png);
 +
}
 +
 
 +
#navi #menu ul li.active a {
 +
  font-weight: 700;
 +
}
 +
 
 +
#navi #menu #hauptMenu ul li{
 +
  font-size: 24px;
 +
  height: 34px;
 +
  line-height: 34px;
 +
}
 +
 
 +
#navi #menu .subMenu ul li {
 +
  width: 180px;
 +
  line-height: 20px;
   height: 20px;
   height: 20px;
   padding-bottom: 7px;
   padding-bottom: 7px;
-
  margin-left: 10px;
 
-
  width: 120px;
 
}
}
-
#navi #menu #projectMenu ul li:hover {
+
#navi #menu .subMenu ul li:hover {
   background-image: url(http://igem-ut.net/2011/trans.png);
   background-image: url(http://igem-ut.net/2011/trans.png);
}
}
Line 444: Line 480:
UT_Tokyo.menuMap = UT_Tokyo.menuMap || {};
UT_Tokyo.menuMap = UT_Tokyo.menuMap || {};
UT_Tokyo.currentMenuEntry = UT_Tokyo.currentMenuEntry != null ? UT_Tokyo.currentMenuEntry : -1;
UT_Tokyo.currentMenuEntry = UT_Tokyo.currentMenuEntry != null ? UT_Tokyo.currentMenuEntry : -1;
 +
UT_Tokyo.hoveringMenuEntry = UT_Tokyo.hoveringMenuEntry != null ? UT_Tokyo.hoveringMenuEntry : -1;
 +
UT_Tokyo.submenuIdMap = {
 +
  '1': '#teamMenu',
 +
  '2': '#projectMenu',
 +
  '3': '#dataMenu',
 +
  '4': '#societyMenu',
 +
};
 +
 +
UT_Tokyo._showSubmenuIfExist = function(idx, fadeTime) {
 +
  $('#navi #menu .subMenu').fadeOut(fadeTime);
 +
  if (idx in UT_Tokyo.submenuIdMap) {
 +
    $('#navi #menu ' + UT_Tokyo.submenuIdMap[idx]).fadeIn(fadeTime);
 +
  }
 +
};
UT_Tokyo.menuIndexFromFullPageName = function(fullPageName) {
UT_Tokyo.menuIndexFromFullPageName = function(fullPageName) {
   if (fullPageName.match('Team:UT-Tokyo/?$')) return 0;
   if (fullPageName.match('Team:UT-Tokyo/?$')) return 0;
-
   else if (fullPageName.match('Team:UT-Tokyo/Team')) return 1;
+
   else if (fullPageName.match('Team:UT-Tokyo/(Team|Acknowledgment)')) return 1;
   else if (fullPageName.match('Team:UT-Tokyo/Project')) return 2;
   else if (fullPageName.match('Team:UT-Tokyo/Project')) return 2;
-
   else if (fullPageName.match('Team:UT-Tokyo/Acknowledgment')) return 3;
+
   else if (fullPageName.match('Team:UT-Tokyo/(Data|Parts|LabNote)')) return 3;
-
   else if (fullPageName.match('Team:UT-Tokyo/Safety')) return 4;
+
   else if (fullPageName.match('Team:UT-Tokyo/(Society|HumanPractice|Safety)')) return 4;
-
  else if (fullPageName.match('Team:UT-Tokyo/Parts')) return 5;
+
-
  else if (fullPageName.match('Team:UT-Tokyo/Data')) return 6;
+
   else return 0; // invalid!
   else return 0; // invalid!
};
};
Line 460: Line 508:
};
};
-
UT_Tokyo.selectMenuEntry = function(idx) {
+
UT_Tokyo.setActive = function(idx) {
-
   $('#navi #menu #hauptMenu ul li').css('background-image', 'none');
+
   $.each(UT_Tokyo.menuMap, function() {
-
  if (idx == 2) {
+
     $(this).removeClass('active');
-
    $('#projectMenu').fadeIn(0);
+
-
  } else {
+
-
    $('#projectMenu').fadeOut(0);
+
-
  }
+
-
  $('#slider').nivoToggle(idx);
+
-
  $('#navi').mouseleave(function() {
+
-
     $('#slider').nivoToggle(idx);
+
-
    if (UT_Tokyo.currentMenuEntry != 2) {
+
-
      $(UT_Tokyo.menuMap[2]).css('background-image', 'none');
+
-
      $('#projectMenu').fadeOut(200);
+
-
    }
+
   });
   });
-
   $(this.menuMap[idx]).css('background-image', 'url(http://igem-ut.net/2011/trans.png)');
+
   $(UT_Tokyo.menuMap[idx]).addClass('active');
-
   this.currentMenuEntry = idx;
+
   UT_Tokyo.activeMenuEntry = idx;
 +
  UT_Tokyo._showSubmenuIfExist(idx, 0);
};
};
-
UT_Tokyo.hoverMenuEntry = function(idx) {
+
UT_Tokyo.setHover = function(idx) {
-
   $(this.menuMap[idx]).css('background-image', 'url(http://igem-ut.net/2011/trans.png)');
+
   $.each(UT_Tokyo.menuMap, function() {
-
  if (idx == 2) {
+
     $(this).removeClass('hover');
-
     $('#projectMenu').fadeIn(200);
+
   });
-
   } else if (UT_Tokyo.currentMenuEntry != 2) {
+
  $(UT_Tokyo.menuMap[idx]).addClass('hover');
-
    $(this.menuMap[2]).css('background-image', 'none');
+
  UT_Tokyo.hoverMenuEntry = idx;
-
    $('#projectMenu').fadeOut(200);
+
   UT_Tokyo._showSubmenuIfExist(idx, 300);
-
   }
+
-
  $('#slider').nivoToggle(idx);
+
};
};
-
UT_Tokyo.leaveMenuEntry = function(idx) {
+
UT_Tokyo.unsetHover = function() {
-
   if ((idx != this.currentMenuEntry) * (idx != 2)) { // using * instead of &&
+
   $.each(UT_Tokyo.menuMap, function() {
-
     $(this.menuMap[idx]).css('background-image', 'none');
+
     $(this).removeClass('hover');
-
   }
+
   });
 +
  UT_Tokyo._showSubmenuIfExist(UT_Tokyo.activeMenuEntry, 300);
};
};
Line 499: Line 536:
   fullPageName.replace(/^\s*(.*?)\s*$/, "$1");
   fullPageName.replace(/^\s*(.*?)\s*$/, "$1");
   var idx = this.menuIndexFromFullPageName(fullPageName);
   var idx = this.menuIndexFromFullPageName(fullPageName);
-
   this.selectMenuEntry(idx);
+
   this.setActive(idx);
};
};
Line 611: Line 648:
     UT_Tokyo.registerMenuItem(idx, this);
     UT_Tokyo.registerMenuItem(idx, this);
     $(this).mouseenter(function() {
     $(this).mouseenter(function() {
-
       UT_Tokyo.hoverMenuEntry(idx, this);
+
       UT_Tokyo.setHover(idx);
-
    });
+
-
    $(this).mouseleave(function() {
+
-
      UT_Tokyo.leaveMenuEntry(idx, this);
+
     });
     });
 +
  });
 +
 
 +
  $('#navi #menu').mouseleave(function() {
 +
    UT_Tokyo.unsetHover();
   });
   });
    
    

Revision as of 13:56, 25 September 2011