Team:Manchester
From 2013.igem.org
Line 1: | Line 1: | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
<!-- ============================================================= | <!-- ============================================================= | ||
Line 392: | Line 366: | ||
</ul> </font></b> </div> | </ul> </font></b> </div> | ||
</div> | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | {{:Team:Manchester/layout/noheader}} | ||
+ | {{:Team:Manchester/layout/banner}} | ||
+ | {{:Team:Manchester/layout/nav}} | ||
+ | {{:Team:Manchester/layout/background}} | ||
+ | |||
+ | |||
+ | <span style="font-family:Arial;font-size:22px;font-style:normal;font-weight:bold;text-decoration:none;text-transform:none;color:990099;">We're working on our iGem Wiki page right now - Please check back later!</span> | ||
+ | |||
+ | <table border="0" align="center"> | ||
+ | <tr> | ||
+ | <td>[[File:logo.jpg|300px|center]]</td> | ||
+ | <td>[[File:300px-Logo_finished.png|300px|center]]</td> | ||
+ | |||
+ | </tr> | ||
+ | |||
+ | </table> | ||
+ | |||
+ | |||
+ | [[File:mib.jpg|270px]] [[File:Uom-logo.jpg|270px|]] | ||
+ | |||
+ | <html> | ||
+ | |||
+ | <html> | ||
+ | |||
+ | <html> |
Revision as of 18:39, 17 June 2013
<body>
<style>
- contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo{
display:none;}
- top-section {
background-repeat: no-repeat; background-position: center top; height:1220px ! important; background:#215E21; } body {
background: white url('http://igemtoronto.files.wordpress.com/2012/07/white-writing-29491444-516-350.jpg') no-repeat center top; background-attachment: fixed; height:0px;
}
- content{height:0px}
h1 a, h2 a, h3 a { text-decoration: none; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: 1.75em; line-height: 1.5em; font-weight: 200; color:990099 } p { text-decoration: none; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: 1.25em; line-height: 1.5em; font-weight: 150; color:990099 }
.slideshow {
position: relative;
min-height: 220px;
clear: both;
margin: 35px 0 25px;
}
.slide {
float: left;
} .slide h3 a:hover { text-decoration: none; font-weight: bold; } .slide label {
background: #2F2F2F; padding: 3px 7px; border: 1px solid #215E21; margin-right: 4px; position: relative; left: 1px; top: 280px; -webkit-transition: background-color .17s linear; -moz-transition: background-color .17s linear; transition: background-color .17s linear;
} .slide [type=radio] { display: none; } .content { position: absolute; top: -1px; left: -400px; background: #215E21; width: 500px; padding: 20px; border: 1px solid #215E21; opacity: 0;
height: 100%;
-webkit-transition: all .6s linear;
-moz-transition: all .6s linear; transition: all .6s linear;
}
[type=radio]:checked ~ label { background: #215E21; border-bottom: 1px solid #215E21; z-index: 2; } [type=radio]:checked ~ label ~ .content { z-index: 1; opacity: 1; left: 0; }
- fisheye_menu {
list-style: none; padding: 0; margin: 10px; height: 140px; }
- fisheye_menu li {
position: relative; display: block; float: left; margin: 0; padding: 0; }
- fisheye_menu span {
position: absolute; top: 100%; left: 0; text-align: center; width: 95px;
padding: 1px;
margin: 0; border: solid 1px #bbb; color: #333; background: #eee; }
- fisheye_menu a {
text-decoration: none; margin: 0; padding: 0; }
- fisheye_menu img {
border: 0; vertical-align: top; }
- stuff {
overflow: hidden; width: 853px; height: 204px; -webkit-box-shadow: 0px 0px 50px 10px #215E21; -moz-box-shadow: 0px 0px 50px 10px #215E21; box-shadow: 0px 0px 50px 10px #215E21; }
- stuff-inside {
width:10000px; height: 204px; }
.pag { width: 853px; height: 204px; float: left; }
- stuff-inside-1:target #stuff-inside {
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
margin-left: 0px; }
- stuff-inside-2:target #stuff-inside {
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
margin-left: -853px; }
- stuff-inside-3:target #stuff-inside {
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
margin-left: -1706px; }
- stuff-inside-4:target #stuff-inside {
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
margin-left: -2559px; }
- stuff-inside-5:target #stuff-inside {
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
margin-left: -3412px; } .pag-info { height: 40px; background-color: #215E21; opacity:0.9; position: relative; margin-top: 0px; bottom: 50px; color: #147025; padding-left: 20px; padding-top: 20px; }
- nav {
list-style-type: none; width: 156px; height: 16px; margin: 0 auto; margin-top: 20px; padding: 0; color:#215E21; } .click { float: left; background: #74C365; width: 16px; height: 16px; -webkit-border-radius: 8px; -moz-border-radius: 8px;
border-radius: 8px;
margin-left: 5px; margin-right: 5px; } .click:hover { -webkit-box-shadow: inset 0px 0px 2px 2px #d4d4d4; -moz-box-shadow: inset 0px 0px 2px 2px #d4d4d4;
box-shadow: inset 0px 0px 2px 2px #d4d4d4;
} .click:active { -webkit-box-shadow: inset 0px 0px 2px 2px #7a7a7a; -moz-box-shadow: inset 0px 0px 2px 2px #7a7a7a;
box-shadow: inset 0px 0px 2px 2px #7a7a7a;
} .click a { display: block; width: 16px; height: 16px; } li {
list-style: none;
} </style>
<script type="text/javascript">
var fisheyemenu = {
startSize : 65,
endSize : 90,
imgType : ".png",
init : function () {
var animElements = document.getElementById("fisheye_menu").getElementsByTagName("img");
var titleElements = document.getElementById("fisheye_menu").getElementsByTagName("span");
for(var j=0; j<titleElements.length; j++) {
titleElements[j].style.display = 'none';
}
for(var i=0; i<animElements.length; i++) {
var y = animElements[i];
y.style.width = fisheyemenu.startSize+'px';
y.style.height = fisheyemenu.startSize+'px';
fisheyemenu.imgSmall(y);
animElements[i].onmouseover = changeSize;
animElements[i].onmouseout = restoreSize;
}
function changeSize() {
fisheyemenu.imgLarge(this);
var x = this.parentNode.getElementsByTagName("span");
x[0].style.display = 'block';
if (!this.currentWidth) this.currentWidth = fisheyemenu.startSize;
fisheyemenu.resizeAnimation(this,this.currentWidth,fisheyemenu.endSize,15,10,0.333);
}
function restoreSize() {
var x = this.parentNode.getElementsByTagName("span");
x[0].style.display = 'none';
if (!this.currentWidth) return;
fisheyemenu.resizeAnimation(this,this.currentWidth,fisheyemenu.startSize,15,10,0.5);
fisheyemenu.imgSmall(this);
}
},
resizeAnimation : function (elem,startWidth,endWidth,steps,intervals,powr) {
if (elem.widthChangeMemInt) window.clearInterval(elem.widthChangeMemInt);
var actStep = 0;
elem.widthChangeMemInt = window.setInterval(
function() {
elem.currentWidth = fisheyemenu.easeInOut(startWidth,endWidth,steps,actStep,powr);
elem.style.width = elem.currentWidth+"px";
elem.style.height = elem.currentWidth+"px";
actStep++;
if (actStep > steps) window.clearInterval(elem.widthChangeMemInt);
}
,intervals)
},
easeInOut : function (minValue,maxValue,totalSteps,actualStep,powr) {
//Generic Animation Step Value Generator By www.hesido.com
var delta = maxValue - minValue;
var stepp = minValue+(Math.pow(((1 / totalSteps)*actualStep),powr)*delta);
return Math.ceil(stepp)
},
imgSmall : function (obj) {
imgSrc = obj.getAttribute("src");
var typePos = imgSrc.indexOf(fisheyemenu.imgType, 0);
var imgName = imgSrc.substr(0, typePos);
obj.setAttribute("src", imgName+"_small"+fisheyemenu.imgType);
},
imgLarge : function (obj) {
imgSrc = obj.getAttribute("src");
var typePos = imgSrc.indexOf("_small", 0);
var imgName = imgSrc.substr(0, typePos);
obj.setAttribute("src", imgName+fisheyemenu.imgType);
}
}
// Add event with wide browser support
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", fisheyemenu.init, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", fisheyemenu.init );
else {
if ( window.onload != null ) { var oldOnload = window.onload; window.onload = function ( e ) { oldOnload( e ); fisheyemenu.init(); }; } else window.onload = fisheyemenu.init;
} </script>
<body style="overflow-y:scroll;" >
<img src="" alt="Background" width="965" height="130"/>