Team:UT-Tokyo/Templates/BeginContent
From 2011.igem.org
(Difference between revisions)
m |
|||
(25 intermediate revisions not shown) | |||
Line 4: | Line 4: | ||
<style type="text/css"> | <style type="text/css"> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
body { | body { | ||
background-color: #575757; | background-color: #575757; | ||
Line 190: | Line 179: | ||
background-color: #383838 | background-color: #383838 | ||
} | } | ||
+ | |||
+ | .left-menu a { | ||
+ | text-transform: none; | ||
+ | } | ||
+ | |||
.right-menu { | .right-menu { | ||
position: absolute; | position: absolute; | ||
Line 284: | 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( | + | 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 296: | Line 289: | ||
} | } | ||
- | #navi #menu | + | #navi #menu .subMenu { |
- | width: | + | width: 220px; |
- | + | ||
position: absolute; | position: absolute; | ||
- | + | left: 160px; | |
- | left: | + | background-image: url(https://static.igem.org/mediawiki/2011/e/e7/UT_Tokyo_trans.png); |
- | background-image: url( | + | background-repeat: repeat; |
- | background-repeat: | + | |
display: none; | display: none; | ||
} | } | ||
- | #navi #menu #projectMenu # | + | #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; | ||
- | + | left: -25px; | |
- | left: | + | |
} | } | ||
- | #navi #menu #projectMenu # | + | |
+ | #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: | + | left: 10px; |
} | } | ||
Line 323: | Line 339: | ||
#navi #menu ul li { | #navi #menu ul li { | ||
- | font: 500 | + | font: 500 20px "Maven Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; |
list-style: none; | list-style: none; | ||
display: block; | display: block; | ||
- | width: | + | width: 110px; |
height: 23px; | height: 23px; | ||
line-height: 27px; | line-height: 27px; | ||
Line 335: | Line 351: | ||
#navi #menu ul li a{ | #navi #menu ul li a{ | ||
color: #fff; | color: #fff; | ||
- | |||
display: block; | display: block; | ||
text-decoration: none; | text-decoration: none; | ||
+ | vertical-align: middle; | ||
} | } | ||
- | #navi #menu # | + | #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; | ||
- | |||
- | |||
} | } | ||
- | #navi #menu | + | #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 390: | Line 420: | ||
position:absolute; | position:absolute; | ||
z-index:5; | z-index:5; | ||
+ | } | ||
+ | |||
+ | #references ul li { | ||
+ | list-style-type: none; | ||
+ | font-size: 15px; | ||
} | } | ||
Line 417: | Line 452: | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
+ | window.onunload = function() {}; | ||
String.prototype.startswith = function (str){ | String.prototype.startswith = function (str){ | ||
Line 455: | 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/ | + | 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 return 0; // invalid! | else return 0; // invalid! | ||
}; | }; | ||
Line 471: | Line 519: | ||
}; | }; | ||
- | UT_Tokyo. | + | UT_Tokyo.setActive = function(idx) { |
- | $( | + | $.each(UT_Tokyo.menuMap, function() { |
- | + | $(this).removeClass('active'); | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | $( | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
}); | }); | ||
- | $( | + | $(UT_Tokyo.menuMap[idx]).addClass('active'); |
- | + | UT_Tokyo.activeMenuEntry = idx; | |
+ | $('#slider').nivoToggle(idx); | ||
+ | UT_Tokyo._showSubmenuIfExist(idx, 0); | ||
}; | }; | ||
- | UT_Tokyo. | + | UT_Tokyo.setHover = function(idx) { |
- | $( | + | $.each(UT_Tokyo.menuMap, function() { |
- | + | $(this).removeClass('hover'); | |
- | $( | + | }); |
- | } | + | $(UT_Tokyo.menuMap[idx]).addClass('hover'); |
- | + | UT_Tokyo.hoverMenuEntry = idx; | |
- | + | ||
- | + | ||
$('#slider').nivoToggle(idx); | $('#slider').nivoToggle(idx); | ||
+ | UT_Tokyo._showSubmenuIfExist(idx, 300); | ||
}; | }; | ||
- | UT_Tokyo. | + | UT_Tokyo.unsetHover = function() { |
- | + | $.each(UT_Tokyo.menuMap, function() { | |
- | $(this | + | $(this).removeClass('hover'); |
- | + | }); | |
+ | $('#slider').nivoToggle(UT_Tokyo.activeMenuEntry); | ||
+ | UT_Tokyo._showSubmenuIfExist(UT_Tokyo.activeMenuEntry, 300); | ||
}; | }; | ||
Line 510: | Line 550: | ||
fullPageName.replace(/^\s*(.*?)\s*$/, "$1"); | fullPageName.replace(/^\s*(.*?)\s*$/, "$1"); | ||
var idx = this.menuIndexFromFullPageName(fullPageName); | var idx = this.menuIndexFromFullPageName(fullPageName); | ||
- | this. | + | this.setActive(idx); |
}; | }; | ||
Line 610: | 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 622: | Line 665: | ||
UT_Tokyo.registerMenuItem(idx, this); | UT_Tokyo.registerMenuItem(idx, this); | ||
$(this).mouseenter(function() { | $(this).mouseenter(function() { | ||
- | UT_Tokyo. | + | UT_Tokyo.setHover(idx); |
- | + | ||
- | + | ||
- | + | ||
}); | }); | ||
+ | }); | ||
+ | |||
+ | $('#navi #menu').mouseleave(function() { | ||
+ | UT_Tokyo.unsetHover(); | ||
}); | }); | ||
Line 652: | 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 | ||
Line 660: | Line 714: | ||
<html>') | <html>') | ||
}); | }); | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
</script> | </script> | ||
Line 683: | 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=" | + | <img src="https://static.igem.org/mediawiki/2011/2/28/UT-Tokyo_Menu_Top.jpg" /> |
- | <img src=" | + | <img src="https://static.igem.org/mediawiki/2011/4/4c/UT_Top2.png" /> |
- | <img src=" | + | <img src="https://static.igem.org/mediawiki/2011/7/7a/UT_Top3.png" /> |
- | <img src=" | + | <img src="https://static.igem.org/mediawiki/2011/b/bf/UT_Top4.png" /> |
- | + | <img src="https://static.igem.org/mediawiki/2011/1/1a/UT_Top5.png" /> | |
- | <img src=" | + | |
- | + | ||
</div> | </div> | ||
<div id="menu"> | <div id="menu"> | ||
Line 697: | 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/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=" | + | <div id="teamMenu" 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/Team">Members</a></li> | |
- | + | <li><a href="https://2011.igem.org/Team:UT-Tokyo/Acknowledgment">Acknowledgment</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 id="pageContent"></html> | <div id="pageContent"></html> |
Latest revision as of 01:51, 6 October 2011