Team:UT-Tokyo/Templates/BeginContent

From 2011.igem.org

(Difference between revisions)
 
(43 intermediate revisions not shown)
Line 4: Line 4:
<style type="text/css">
<style type="text/css">
-
 
-
/* @group general settings */
 
body {
body {
   background-color: #575757;
   background-color: #575757;
Line 24: Line 22:
   border-style: none;
   border-style: none;
   color: #ddd;
   color: #ddd;
-
   font: 15px/32px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
+
   font: 17px/32px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
   padding: 0;
   padding: 0;
}
}
Line 52: Line 50:
#pageContent h3 {
#pageContent h3 {
-
   color: #fff;
+
   color: #ddd;
-
   font: 700 20px "Maven Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
+
   font: 700 17px "Maven Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
   padding-top: 16px;
   padding-top: 16px;
   padding-bottom: 10px;
   padding-bottom: 10px;
}
}
-
 
#pageContent p {
#pageContent p {
Line 77: Line 74:
   padding:8px; border-left: 1px solid #999;
   padding:8px; border-left: 1px solid #999;
   color: #ddd;
   color: #ddd;
-
   font: 15px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
+
   font: 17px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
}
}
#pageContent ol.protocol li p em { display:block; }
#pageContent ol.protocol li p em { display:block; }
Line 91: Line 88:
#pageContent ul li {
#pageContent ul li {
   margin-bottom: 8px;
   margin-bottom: 8px;
-
   font: 15px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
+
   font: 17px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
}
}
Line 99: Line 96:
#pageContent dl dt {
#pageContent dl dt {
-
   font: Bold 15px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
+
   font: Bold 17px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
   margin-bottom: 8px;
   margin-bottom: 8px;
}
}
#pageContent dl dd {
#pageContent dl dd {
-
   font: 15px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
+
   font: 17px/20px "Segoe UI",Calibri,"Myriad Pro",Myriad,Frutiger,"Frutiger Linotype","Trebuchet MS",Helvetica,Arial,sans-serif;
   margin-bottom: 16px;
   margin-bottom: 16px;
}
}
Line 132: Line 129:
   padding: 5px;
   padding: 5px;
   background-color: #383838;
   background-color: #383838;
-
}
 
-
#pageContent table tr:nth-child(even) td {
 
-
  background-color: #393F40;
 
}
}
Line 185: Line 179:
   background-color: #383838
   background-color: #383838
}
}
 +
 +
.left-menu a {
 +
  text-transform: none;
 +
}
 +
.right-menu {
.right-menu {
   position: absolute;
   position: absolute;
Line 279: Line 278:
   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;*/
-
background-image: url(http://igem-ut.net/2011/gradation.png);
+
background-image: url(https://static.igem.org/mediawiki/2011/b/b8/UT_Tokyo_gradation.png);
background-repeat: repeat-y;
background-repeat: repeat-y;
width: 200px;
width: 200px;
Line 291: Line 289:
}
}
-
#navi #menu #projectMenu {
+
#navi #menu .subMenu {
-
   width: 300px;
+
   width: 220px;
-
  height: 120px;
+
   position: absolute;
   position: absolute;
-
  top: 25px;
+
   left: 160px;
-
   left: 200px;
+
   background-image: url(https://static.igem.org/mediawiki/2011/e/e7/UT_Tokyo_trans.png);
-
   background-image: url(http://igem-ut.net/2011/projectMenuBg.png);
+
   background-repeat: repeat;
-
   background-repeat: no-repeat;
+
   display: none;
   display: none;
}
}
-
#navi #menu #projectMenu #projectMenu1 {
+
#navi #menu #teamMenu {
 +
  top: 25px;
 +
  height: 70px;
 +
}
 +
 
 +
#navi #menu #projectMenu {
 +
  top: 15px;
 +
  height: 150px; 
 +
}
 +
 
 +
#navi #menu #dataMenu {
 +
  top: 15px;
 +
  height: 150px;
 +
}
 +
 
 +
#navi #menu #societyMenu {
 +
  top: 105px;
 +
  height: 70px;
 +
}
 +
 
 +
#navi #menu .subMenu img {
   position: absolute;
   position: absolute;
-
  top: 6px;
+
   left: -25px;
-
   left: 10px;
+
}
}
-
#navi #menu #projectMenu #projectMenu2 {
+
 
 +
#navi #menu #teamMenu img {top: 13px;}
 +
#navi #menu #projectMenu img {top: 60px;}
 +
#navi #menu #dataMenu img {top: 94px;}
 +
#navi #menu #societyMenu img {top: 43px;}
 +
 
 +
#navi #menu .subMenu ul {
   position: absolute;
   position: absolute;
   top: 6px;
   top: 6px;
-
   left: 140px;
+
   left: 10px;
}
}
Line 318: Line 339:
#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 330: Line 351:
#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 385: Line 420:
position:absolute;
position:absolute;
z-index:5;
z-index:5;
 +
}
 +
 +
#references ul li {
 +
  list-style-type: none;
 +
  font-size: 15px;
}
}
Line 412: Line 452:
<script type="text/javascript">
<script type="text/javascript">
 +
window.onunload = function() {};
String.prototype.startswith = function (str){
String.prototype.startswith = function (str){
     return this.indexOf(str) == 0;
     return this.indexOf(str) == 0;
};
};
-
 
-
 
var UT_Tokyo = UT_Tokyo || {};
var UT_Tokyo = UT_Tokyo || {};
Line 452: Line 491:
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|Outreach|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 468: Line 519:
};
};
-
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;
 +
  $('#slider').nivoToggle(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);
+
-
  }
+
   $('#slider').nivoToggle(idx);
   $('#slider').nivoToggle(idx);
 +
  UT_Tokyo._showSubmenuIfExist(idx, 300);
};
};
-
UT_Tokyo.leaveMenuEntry = function(idx) {
+
UT_Tokyo.unsetHover = function() {
-
   if ((idx != this.currentMenuEntry) * (idx != 2)) { // using * instead of &amp;&amp;
+
   $.each(UT_Tokyo.menuMap, function() {
-
     $(this.menuMap[idx]).css('background-image', 'none');
+
     $(this).removeClass('hover');
-
   }
+
  });
 +
  $('#slider').nivoToggle(UT_Tokyo.activeMenuEntry);
 +
   UT_Tokyo._showSubmenuIfExist(UT_Tokyo.activeMenuEntry, 300);
};
};
Line 507: Line 550:
   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 607: Line 650:
$(document).ready(function () {
$(document).ready(function () {
   UT_Tokyo.currentUrl = 'https://2011.igem.org' + location.pathname;
   UT_Tokyo.currentUrl = 'https://2011.igem.org' + location.pathname;
 +
 +
  // add link to the hq <- "iGEM HQ" sounds slightly different from "iGEM 2011 Main Page"... (Shimizu)
 +
  $('.left-menu ul').prepend('<li><a href="/"><img src="https://static.igem.org/mediawiki/2011/7/70/UT-Tokyo_IGEM_basic_Logo_white.png" /> <b>iGEM 2011 Top</b></a></li>');
   $('#slider').nivoSlider({
   $('#slider').nivoSlider({
Line 613: Line 659:
     manualAdvance: true,
     manualAdvance: true,
     animSpeed: 200,
     animSpeed: 200,
 +
    effect: 'fade,fold',
   });
   });
    
    
Line 618: Line 665:
     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();
   });
   });
    
    
Line 648: Line 696:
     */
     */
   }
   }
 +
 +
  $('sup.ref').each(function() {
 +
    var m = $(this).html();
 +
    var num = m.substr(1, m.length-2);
 +
    $(this).css('cursor', 'pointer').css('color', '#7FB9FF').click(function() {
 +
      $.scrollTo('#ref_'+num, 0);
 +
      $('#references ul li').css('background-color', '#383838');
 +
      $('#ref_'+num).css('background-color', '#655');
 +
    });
 +
  });
 +
   $("p:empty").remove(); // remove empty p element generated by MediaWiki
   $("p:empty").remove(); // remove empty p element generated by MediaWiki
-
    
+
   $('#pageContent table tr:odd td').css('background-color','#393F40');
   UT_Tokyo.initMenu('\
   UT_Tokyo.initMenu('\
\</html>
\</html>
Line 655: Line 714:
<html>')
<html>')
});
});
 +
</script>
</script>
<div id="header">
<div id="header">
Line 669: Line 729:
   <div class="slider-wrapper theme-default">
   <div class="slider-wrapper theme-default">
     <div id="slider" class="nivoSlider">
     <div id="slider" class="nivoSlider">
-
       <img src="http://igem-ut.net/2011/img1.png" />
+
       <img src="https://static.igem.org/mediawiki/2011/2/28/UT-Tokyo_Menu_Top.jpg" />
-
       <img src="http://igem-ut.net/2011/img2.png" />
+
       <img src="https://static.igem.org/mediawiki/2011/4/4c/UT_Top2.png" />
-
       <img src="http://igem-ut.net/2011/img3.png" />
+
       <img src="https://static.igem.org/mediawiki/2011/7/7a/UT_Top3.png" />
-
       <img src="http://igem-ut.net/2011/img4.jpg" />
+
       <img src="https://static.igem.org/mediawiki/2011/b/bf/UT_Top4.png" />
-
      <img src="http://igem-ut.net/2011/img5.jpg" />
+
       <img src="https://static.igem.org/mediawiki/2011/1/1a/UT_Top5.png" />
-
       <img src="http://igem-ut.net/2011/img6.jpg" />
+
-
      <img src="http://igem-ut.net/2011/img7.jpg" />
+
     </div>
     </div>
     <div id="menu">
     <div id="menu">
Line 683: Line 741:
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Team">Team</a></li>
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Team">Team</a></li>
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project">Project</a></li>
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project">Project</a></li>
-
      <li><a href="https://2011.igem.org/Team:UT-Tokyo/Acknowledgment">Acknowledgment</a></li>
 
-
      <li><a href="https://2011.igem.org/Team:UT-Tokyo/Safety">Safety</a></li>
 
-
      <li><a href="https://2011.igem.org/Team:UT-Tokyo/Parts">Parts submitted</a></li>
 
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Data">Data</a></li>
       <li><a href="https://2011.igem.org/Team:UT-Tokyo/Data">Data</a></li>
 +
      <li><a href="https://2011.igem.org/Team:UT-Tokyo/Society">Society</a></li>
     </ul>
     </ul>
     </div>
     </div>
-
     <div id="projectMenu">
+
     <div id="teamMenu" class="subMenu">
-
    <ul id="projectMenu1">
+
      <img src="https://static.igem.org/mediawiki/2011/f/f2/UT_Tokyo_triangle.png" alt="" />
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Background">Background</a></li>
+
      <ul>
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Introduction">Introduction</a></li>
+
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Team">Members</a></li>
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Concepts">Concepts</a></li>
+
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Acknowledgment">Acknowledgment</a></li>
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Method">Method</a></li>
+
      </ul>
-
    </ul>
+
-
    <ul id="projectMenu2">
+
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Achievement">Achievement</a></li>
+
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Results">Results</a></li>
+
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Discussion">Discussion</a></li>
+
-
    <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Modeling">Modeling</a></li>
+
-
    </ul>
+
     </div>
     </div>
 +
    <div id="projectMenu" class="subMenu">
 +
      <img src="https://static.igem.org/mediawiki/2011/f/f2/UT_Tokyo_triangle.png" alt="" />
 +
      <ul>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Background">Background</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/System">System</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Results">Results</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Discussion">Discussion</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Project/Achievement">Achievement</a></li>
 +
      </ul>
     </div>
     </div>
 +
    <div id="dataMenu" class="subMenu">
 +
      <img src="https://static.igem.org/mediawiki/2011/f/f2/UT_Tokyo_triangle.png" alt="" />
 +
      <ul>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Data">Data</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Data/Method">Method</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Data/Modeling">Modeling</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Parts">Parts submitted</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/LabNote">Lab Note</a></li>
 +
      </ul>
 +
    </div>
 +
    <div id="societyMenu" class="subMenu">
 +
      <img src="https://static.igem.org/mediawiki/2011/f/f2/UT_Tokyo_triangle.png" alt="" />
 +
      <ul>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Safety">Safety</a></li>
 +
        <li><a href="https://2011.igem.org/Team:UT-Tokyo/Outreach">Outreach</a></li>
 +
      </ul>
 +
    </div>
 +
    </div>
 +
  </div>
</div>
</div>
-
</div>
 
-
 
<div id="pageContent"></html>
<div id="pageContent"></html>

Latest revision as of 01:51, 6 October 2011