Difference between revisions of "Template:Pitt"

Line 127: Line 127:
 
})(jQuery);
 
})(jQuery);
  
−
$("#menuContainer > ul > li:has(ul)").children("ul").each(function(){
+
$("#menuContainer li, #menuContainer td").hover(
−
var padding = parseInt($(this).parent().css("padding-left")) + parseInt($(this).parent().css("padding-right"));
+
−
var newWidth = parseInt($(this).parent().css("width")) + padding;
+
−
if (newWidth > parseInt($(this).css("width"))){
+
−
$(this).css("width", newWidth + 'px');
+
−
} else {
+
−
$(this).parent().css("width", (parseInt($(this).css("width")) - padding) +'px');
+
−
}
+
−
});
+
−
 
+
−
var size = 0;
+
−
var number = 0;
+
−
$("#menuContainer > ul > li").each(function(){
+
−
size += $(this).width();
+
−
number++;
+
−
});
+
−
var padding = ($(document).width() - size)/(2*number);
+
−
$("#menuContainer > ul > li").css({"padding-left": padding + 'px', "padding-right": padding + 'px'});
+
−
 
+
−
$("#menuContainer li").hover(
+
 
function(){
 
function(){
 
$(this).children().stop(true, false).animate({color: '#eac638'}, 250);
 
$(this).children().stop(true, false).animate({color: '#eac638'}, 250);
Line 155: Line 136:
 
);
 
);
  
−
$("#menuContainer > ul > li:has(ul)").hover(
+
$("#menuContainer td:has(ul)").hover(
 
function(){
 
function(){
 
$(this).children("ul").stop().slideDown(200);
 
$(this).children("ul").stop().slideDown(200);
Line 164: Line 145:
 
);
 
);
  
−
$("#menuContainer > ul > li:has(ul)").children("ul").each(function(){
+
$("#menuContainer td:has(ul)").children("ul").each(function(){
 
var padding = parseInt($(this).parent().css("padding-left")) + parseInt($(this).parent().css("padding-right"));
 
var padding = parseInt($(this).parent().css("padding-left")) + parseInt($(this).parent().css("padding-right"));
 
var newWidth = parseInt($(this).parent().css("width")) + padding;
 
var newWidth = parseInt($(this).parent().css("width")) + padding;
Line 391: Line 372:
 
}
 
}
  
−
#menuContainer > ul > li {
+
#menuContainer td {
−
display:inline-flex;
+
 
position: relative;
 
position: relative;
 
text-align: center;
 
text-align: center;
 +
background-color: #172368;
 +
color: #ffffff;
 +
margin: 0px;
 +
white-space: nowrap;
 
}
 
}
  
−
#menuContainer > ul > li > ul {
+
#menuContainer table {
 +
background-color: #172368;
 +
width: 100%;
 +
}
 +
 
 +
#menuContainer ul {
 
position:absolute;
 
position:absolute;
 
left:0;
 
left:0;
Line 439: Line 428:
  
 
<div id="menuContainer" class="floatyMenu">
 
<div id="menuContainer" class="floatyMenu">
−
<ul>
+
<table><tr>
−
<li>
+
<td>
 
<a href="https://2015.igem.org/Team:Pitt">Home</a>
 
<a href="https://2015.igem.org/Team:Pitt">Home</a>
−
</li>
+
</td>
 
 
−
<li>
+
<td>
 
<a href="#">Project</a>
 
<a href="#">Project</a>
  
Line 455: Line 444:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">Notebook</a>
 
<a href="#">Notebook</a>
  
Line 468: Line 457:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">Team</a>
 
<a href="#">Team</a>
  
Line 481: Line 470:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">Achievements</a>
 
<a href="#">Achievements</a>
  
Line 494: Line 483:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">Other</a>
 
<a href="#">Other</a>
  
Line 507: Line 496:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">Twitter</a>
 
<a href="#">Twitter</a>
  
Line 520: Line 509:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
  
−
<li>
+
<td>
 
<a href="#">iGEM Home</a>
 
<a href="#">iGEM Home</a>
  
Line 533: Line 522:
 
</li>
 
</li>
 
</ul>
 
</ul>
−
</li>
+
</td>
−
</ul>
+
</tr></table>
 
 
 
</div>
 
</div>

Revision as of 13:36, 22 May 2015



Add a banner to your wiki!

You can make the image 980px by 200px

Remember to call the file: "Team_Pitt_banner.jpg"