Template:Menu
From 2012.igem.org
(Difference between revisions)
(80 intermediate revisions not shown) | |||
Line 19: | Line 19: | ||
<style> | <style> | ||
html{font-family:Tahoma, Geneva, sans-serif} | html{font-family:Tahoma, Geneva, sans-serif} | ||
- | # | + | #menu_div{position:absolute;width:100%;width:965px;margin-top:0px} |
- | #menu ul{list-style:none;margin-bottom:65px} | + | #menu{width:932px;margin:-50px auto 0px auto} |
- | #menu ul li {overflow:hidden;margin-left:1px;display:block;background:#222;height:30px;width: | + | #menu ul{list-style:none;margin-bottom:65px;margin-left:0px} |
+ | #menu ul li:first-child{background:rgba(0,0,0,0.9);} | ||
+ | |||
+ | //#menu ul:first-child{background:rgba(20,20,20,0.8);} | ||
+ | #menu ul li {overflow:hidden;margin-left:1px;display:block;background:#222;height:30px;width:132px;text- | ||
+ | align:center;float:left;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;} | ||
#menu ul li:hover {background:#666;} | #menu ul li:hover {background:#666;} | ||
#menu ul li a{color:#fff;text-decoration:none;display:table-cell;vertical-align:middle;text-align:center;height:30px;width:252px;} | #menu ul li a{color:#fff;text-decoration:none;display:table-cell;vertical-align:middle;text-align:center;height:30px;width:252px;} | ||
Line 29: | Line 34: | ||
#left-menu{clear:both;float:left;} | #left-menu{clear:both;float:left;} | ||
#left-menu ul{list-style:none;margin:0px !important;} | #left-menu ul{list-style:none;margin:0px !important;} | ||
- | #left-menu ul li {overflow:hidden;margin-right:28px;margin-left:22px;padding: 1px;display:block;background:#ddd;height:30px;width: | + | #left-menu ul li {overflow:hidden;margin-right:28px;margin-left:22px;padding: 1px;display:block;background:#ddd;height:30px;width:132px;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;} |
#left-menu ul li:hover {background:#666;} | #left-menu ul li:hover {background:#666;} | ||
#left-menu ul li a{color:#222;text-decoration:none;display:table-cell;vertical-align:middle;text-align:center;height:30px;width:152px;} | #left-menu ul li a{color:#222;text-decoration:none;display:table-cell;vertical-align:middle;text-align:center;height:30px;width:152px;} | ||
Line 36: | Line 41: | ||
#main-content{float:left;background-color:#ddd;padding:35px;width:672px;padding-top:20px;margin-left:10px;margin-right:22px;} | #main-content{float:left;background-color:#ddd;padding:35px;width:672px;padding-top:20px;margin-left:10px;margin-right:22px;} | ||
#main-content div{display:none;} | #main-content div{display:none;} | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
#kids { position: absolute; top: 2px; left: 20px; } | #kids { position: absolute; top: 2px; left: 20px; } | ||
- | #kids_g { position: absolute; top: 2px; left: 20px; } | + | #kids_g {;position: absolute; top: 2px; left: 20px; } |
</style> | </style> | ||
<script src="http://code.jquery.com/jquery-latest.min.js"type="text/javascript"></script> | <script src="http://code.jquery.com/jquery-latest.min.js"type="text/javascript"></script> | ||
Line 61: | Line 63: | ||
kids.top = x + "px"; | kids.top = x + "px"; | ||
kids.left = y + "px"; | kids.left = y + "px"; | ||
- | |||
- | |||
- | |||
- | + | ||
- | var kidsG = document.getElementById("kids_g").style; | + | var xx = evnt.clientX / 2.5; |
- | + | var yy = evnt.clientY + 20; | |
- | kidsG.top = | + | |
- | kidsG.left = | + | var kidsG = document.getElementById("kids_g").style; |
- | + | kidsG.top = xx + "px"; | |
- | + | kidsG.left = yy + "px"; | |
- | + | ||
} | } | ||
Line 81: | Line 79: | ||
$(location.hash).css("display","inline"); $(location.hash).stop(true,false).animate({opacity:1}, 200); | $(location.hash).css("display","inline"); $(location.hash).stop(true,false).animate({opacity:1}, 200); | ||
- | $("#p-logo").html('<img src="https://static.igem.org/mediawiki/2012/b/b2/Banner_UW.png"/></a><div id="kids"><img src="https://static.igem.org/mediawiki/2012/3/30/Czerw_ost.png" width="100"></div><div id="kids_g"><img src="https://static.igem.org/mediawiki/2012/e/ed/Ziel_ost.png" width="100"></div>'); | + | $("#p-logo").html('<a href="http://www.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2012/b/b2/Banner_UW.png"/></a><div id="kids"><img src="https://static.igem.org/mediawiki/2012/3/30/Czerw_ost.png" width="100"></div><div id="kids_g"><img src="https://static.igem.org/mediawiki/2012/e/ed/Ziel_ost.png" width="100"></div>'); |
$("#menu li").hover( | $("#menu li").hover( | ||
Line 124: | Line 122: | ||
</style> | </style> | ||
</noscript> | </noscript> | ||
+ | <div id="menu_div"> | ||
<div id="menu"> | <div id="menu"> | ||
<ul> | <ul> | ||
<li><a href="https://2012.igem.org/Team:Warsaw">HOME</a></li> | <li><a href="https://2012.igem.org/Team:Warsaw">HOME</a></li> | ||
- | <li><a href="https://2012.igem.org/Team:Warsaw/Project">PROJECT</a> | + | <li><a href="https://2012.igem.org/Team:Warsaw/Project#whyThis">PROJECT</a> |
<ul> | <ul> | ||
- | <li rel=" | + | <li rel="whyThis"><a href="https://2012.igem.org/Team:Warsaw/Project#whyThis">why this?</a></li> |
- | <li rel=" | + | <li rel="steps"><a href="https://2012.igem.org/Team:Warsaw/Project#steps">steps</a></li> |
- | <li rel=" | + | <li rel="measurement"><a href="https://2012.igem.org/Team:Warsaw/Project#measurement">measurement</a></li> |
</ul> | </ul> | ||
</li> | </li> | ||
- | <li><a href="https://2012.igem.org/Team:Warsaw/Wetlab">WETLAB | + | <li><a href="https://2012.igem.org/Team:Warsaw/Wetlab">WETLAB</a></li> |
- | + | <li><a href="https://2012.igem.org/Team:Warsaw/Parts">PARTS</a></li> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
<li><a href="https://2012.igem.org/Team:Warsaw/Safety">SAFETY</a></li> | <li><a href="https://2012.igem.org/Team:Warsaw/Safety">SAFETY</a></li> | ||
- | <li><a href="https://2012.igem.org/Team:Warsaw/Team">TEAM</a> | + | <li><a href="https://2012.igem.org/Team:Warsaw/Team#team">TEAM</a> |
<ul> | <ul> | ||
- | <li rel="team"><a href="https://2012.igem.org/Team:Warsaw/Team#team"> | + | <li rel="team"><a href="https://2012.igem.org/Team:Warsaw/Team#team">team</a></li> |
- | <li rel="sponsors"><a href="https://2012.igem.org/Team:Warsaw/Team#sponsors"> | + | <li rel="sponsors"><a href="https://2012.igem.org/Team:Warsaw/Team#sponsors">sponsors</a></li> |
- | <li rel=" | + | <li rel="acknowledgements"><a href="https://2012.igem.org/Team:Warsaw/Team#acknowledgements">acknowledgements</a></li> |
- | <li rel=" | + | <li rel="attribution"><a href="https://2012.igem.org/Team:Warsaw/Team#attribution">attribution</a></li> |
</ul> | </ul> | ||
</li> | </li> | ||
Line 153: | Line 147: | ||
<!-- Home,Team,Official Team Profile, Project, Parts Submitted to the Registry, Modelling, Notebook, Safety, Attributions --> | <!-- Home,Team,Official Team Profile, Project, Parts Submitted to the Registry, Modelling, Notebook, Safety, Attributions --> | ||
</ul> | </ul> | ||
+ | </div> | ||
</div> | </div> | ||
- | + | <!-- class of css --> | |
- | <!-- | + | |
<style type="text/css"> | <style type="text/css"> | ||
.ornam{color:#000;background-color:#C0C0C0;padding:2px} | .ornam{color:#000;background-color:#C0C0C0;padding:2px} | ||
- | .box{background-color:#ddd;padding:35px;padding-top:20px;padding-bottom:20px;margin:75px;margin-top:35px;margin-bottom:35px} | + | .box{background-color:#ddd;padding:35px;padding-top:20px;padding-bottom:20px;margin:75px;margin-top:35px;margin-bottom:35px} |
- | + | a {color:green;} | |
- | + | a:visited {color:#006200;} | |
</style> | </style> | ||
Latest revision as of 00:56, 27 September 2012