Team:Oxford/safety
From 2014.igem.org
(Difference between revisions)
Line 13: | Line 13: | ||
body { | body { | ||
- | background- | + | background: url(https://static.igem.org/mediawiki/2014/9/90/Oxigemradcam.jpg) no-repeat center center fixed; |
- | + | -webkit-background-size: cover; | |
+ | -moz-background-size: cover; | ||
+ | -o-background-size: cover; | ||
+ | background-size: cover; | ||
+ | background-position: center top; | ||
+ | margin: 0px; | ||
+ | padding: 0; | ||
+ | border: 0; | ||
vertical-align: baseline; | vertical-align: baseline; | ||
font-family: 'Open Sans', 'helvetica', sans-serif; | font-family: 'Open Sans', 'helvetica', sans-serif; | ||
Line 123: | Line 130: | ||
#menubar li a { | #menubar li a { | ||
background-color: transparent;} | background-color: transparent;} | ||
+ | |||
+ | .outer { | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | padding-top:7%; | ||
+ | } | ||
+ | |||
+ | .inner { | ||
+ | position: relative; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | img.supercoil { | ||
+ | width:65%; | ||
+ | display: block; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto } | ||
+ | |||
+ | .Heading { | ||
+ | position:absolute; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
+ | <script type="text/javascript"> | ||
+ | function iconleft(x) { | ||
+ | x.style.left="6%"; | ||
+ | } | ||
+ | function iconnormal(x) { | ||
+ | x.style.left="9%"; | ||
+ | } | ||
+ | function DCMationbig(x) { | ||
+ | x.style.height="12.5%"; | ||
+ | x.style.width="12.5%"; | ||
+ | } | ||
+ | function DCMationnormal(x) { | ||
+ | x.style.height="11%"; | ||
+ | x.style.width="11%"; | ||
+ | } | ||
+ | function Achievementsbig(x) { | ||
+ | x.style.height="12%"; | ||
+ | x.style.width="12%"; | ||
+ | } | ||
+ | function Achievementsnormal(x) { | ||
+ | x.style.height="11.1%"; | ||
+ | x.style.width="11.1%"; | ||
+ | } | ||
+ | function Modellingbig(x) { | ||
+ | x.style.height="9%"; | ||
+ | x.style.width="9%"; | ||
+ | } | ||
+ | function Modellingnormal(x) { | ||
+ | x.style.height="8.5%"; | ||
+ | x.style.width="8.5%"; | ||
+ | } | ||
+ | function Policybig(x) { | ||
+ | x.style.height="7.9%"; | ||
+ | x.style.width="7.9%"; | ||
+ | } | ||
+ | function Policynormal(x) { | ||
+ | x.style.height="7.3%"; | ||
+ | x.style.width="7.3%"; | ||
+ | } | ||
+ | function iGEMcommbig(x) { | ||
+ | x.style.height="9.4%"; | ||
+ | x.style.width="9.4%"; | ||
+ | } | ||
+ | function iGEMcommnormal(x) { | ||
+ | x.style.height="8.8%"; | ||
+ | x.style.width="8.8%"; | ||
+ | } | ||
+ | function Interlabbig(x) { | ||
+ | x.style.height="7%"; | ||
+ | x.style.width="7%"; | ||
+ | } | ||
+ | function Interlabnormal(x) { | ||
+ | x.style.height="6.5%"; | ||
+ | x.style.width="6.5%"; | ||
+ | } | ||
+ | function Safetybig(x) { | ||
+ | x.style.height="5.6%"; | ||
+ | x.style.width="5.6%"; | ||
+ | } | ||
+ | function Safetynormal(x) { | ||
+ | x.style.height="5%"; | ||
+ | x.style.width="5%"; | ||
+ | } | ||
+ | function Teambig(x) { | ||
+ | x.style.height="4.8%"; | ||
+ | x.style.width="4.8%"; | ||
+ | } | ||
+ | function Teamnormal(x) { | ||
+ | x.style.height="4.4%"; | ||
+ | x.style.width="4.4%"; | ||
+ | } | ||
+ | function Subheadingbig(x) { | ||
+ | x.style.height="40%"; | ||
+ | x.style.width="40%"; | ||
+ | } | ||
+ | function Subheadingnormal(x) { | ||
+ | x.style.height="38%"; | ||
+ | x.style.width="38%"; | ||
+ | } | ||
+ | |||
+ | |||
+ | function DCMation() { | ||
+ | document.getElementById('DCMationwrap').style.display = "block"; | ||
+ | } | ||
+ | function DCMationHide(x) { | ||
+ | document.getElementById('DCMationwrap').style.display = "none"; | ||
+ | } | ||
+ | |||
+ | $(document).ready(function(){ | ||
+ | $("#Heading1").click(function(){ | ||
+ | $("#DCMation1").animate({ | ||
+ | opacity:'1', | ||
+ | height:'400px', | ||
+ | width:'400px', | ||
+ | }); | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | $(document).ready(function(){ | ||
+ | $("#arrowr").click(function(){ | ||
+ | $("#grey").animate({right:'-13%'}, "fast"); | ||
+ | }); | ||
+ | }); | ||
+ | $(document).ready(function(){ | ||
+ | $("#arrowl").click(function(){ | ||
+ | $("#grey").animate({right:'-9%'}, "fast"); | ||
+ | }); | ||
+ | }); | ||
+ | $(document).ready(function(){ | ||
+ | $("#split").click(function(){ | ||
+ | $("#right").animate({left:'85%'}); | ||
+ | $("#left").animate({left:'3.1%'}); | ||
+ | $("#abstract").animate({width:'69.9%', left:'15.1%'}); | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | $(document).ready(function(){ | ||
+ | $("#x").click(function(){ | ||
+ | $("#right").animate({left:'50%'}); | ||
+ | $("#left").animate({left:'38.1%'}); | ||
+ | $("#abstract").animate({width:'0%', left:'50%'}); | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | |||
+ | <title></title> | ||
</head> | </head> | ||
<body> | <body> | ||
+ | <div class="outer"> | ||
+ | |||
+ | <div class="iGEMlogo" style="width:6.5%; position:absolute; top:0.7%; right:0.5%; opacity:0.8;"> | ||
+ | <a href="https://2014.igem.org/Main_Page" target="_blank"><img src="https://static.igem.org/mediawiki/2014/9/98/OxigemiGEM.png" style="width:100%"/></a> | ||
+ | </div> | ||
+ | <a href="#"><img id="arrowl" src="https://static.igem.org/mediawiki/2014/7/77/OxigemArrowl.png" style="position:absolute; width:2.5%; top:50%;right:1.5%; opacity:0.6; z-index:4;" /></a> | ||
+ | <div id="grey" style="width:14%; position:absolute; top:23%; right:-13%; z-index:4;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/0/0d/OxigemGrey.png" style="position:relative;width:100%;" /> | ||
+ | <a href="#"><img id="arrowr" src="https://static.igem.org/mediawiki/2014/0/03/OxigemArrowr.png" style="position:absolute;width:16%;top:5%;left:10%;"></a> | ||
+ | <div class="fbicon" style="position:absolute;width:23%; top:20%; left:9%;" onmouseover= | ||
+ | "iconleft(this)" onmouseout="iconnormal(this)" border="0"><a href="https://www.facebook.com/oxfordigem" target="_blank" style="background-image: none;"><img src="https://static.igem.org/mediawiki/2014/8/88/OxigemIconfacebook.png" style="width:100%;" /></a> | ||
+ | </div> | ||
+ | <div class="twicon" style="position:absolute;width:23%; top:35%; left:9%;" onmouseover= | ||
+ | "iconleft(this)" onmouseout="iconnormal(this)" border="0"> | ||
+ | <a href="https://twitter.com/OxfordiGEM" target="_blank" style="background-image: none;"><img src="https://static.igem.org/mediawiki/2014/3/3d/OxigemIgemtwitter.png" style="width:100%;" /></a> | ||
+ | </div> | ||
+ | <div class="yticon" style="position:absolute;width:23%; top:50%; left:9%;" onmouseover= | ||
+ | "iconleft(this)" onmouseout="iconnormal(this)" border="0"> | ||
+ | <a href="https://www.youtube.com/channel/UCx1QJHqQcZ09aT97V2f4Xdw" target="_blank" style="background-image: none;"><img src="https://static.igem.org/mediawiki/2014/e/ea/OxigemIconyoutube.png" style="width:100%;" /></a> | ||
+ | </div> | ||
+ | <div class="oxicon" style="position:absolute;width:23%; top:65%; left:9%;" onmouseover= | ||
+ | "iconleft(this)" onmouseout="iconnormal(this)" border="0"> | ||
+ | <a href="http://www.ox.ac.uk" target="_blank"><img src="https://static.igem.org/mediawiki/2014/8/8d/Iconoxford.png" style="width:100%;" /></a> | ||
+ | </div> | ||
+ | <div class="mailicon" style="position:absolute;width:23%; top:80%; left:9%;" onmouseover= | ||
+ | "iconleft(this)" onmouseout="iconnormal(this)" border="0" > | ||
+ | <a href="mailto:oxfordigem@bioch.ox.ac.uk" target="_blank" style="background-image: none;"><img src="https://static.igem.org/mediawiki/2014/3/35/OxigemIconmail.png" style="width:100%;" /></a> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="inner"> | ||
+ | <div style="position: relative; width:65% left: 0; top: 0;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/9/97/OxigemUp.png" style="position: relative; width:65%; left: 17%; top: 0;"> | ||
+ | |||
+ | <img id="left" src="https://static.igem.org/mediawiki/2014/7/7b/OxigemLeft.png" style="position: absolute; width:12%; top: 18%; left: 38.1%;"> | ||
+ | <img id="right" src="https://static.igem.org/mediawiki/2014/7/7b/OxigemRight.png" style="position: absolute; width:12%; top: 18%; left: 50%;"> | ||
+ | |||
+ | <div id="abstract" style="position: absolute; width:0%; height:100%; top: 0%; left: 50%; background-color: #000000; opacity:0.6; z-index:10; border-radius:15px;"> | ||
+ | <div id="abstract2"> | ||
+ | <img id="x" src="https://static.igem.org/mediawiki/2014/a/a5/X.png" style="position:absolute;right:0%;" /> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <img id="down" src="https://static.igem.org/mediawiki/2014/1/1c/OxigemDown.png" style="position: absolute; width:65%; top: 0; left: 17%;"> | ||
+ | <a href="#"><img id="split" src="https://static.igem.org/mediawiki/2014/2/21/OxigemBlank.png" style="position: absolute; width:24%; top:35%; left: 38%;" /></a> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="Heading" id="Heading1" style="top: 72%; left: 35.5%; width:11%;" onclick="DCMation()" onmouseover= | ||
+ | "DCMationbig(this)" onmouseout="DCMationnormal(this)" border="0"><a href="#"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/2/22/OxigemDCMationheading.png" style="width: 100%;" ></a></div> | ||
+ | |||
+ | <div class="Heading" style="top: 77.8%; left: 53%; width:11.1%;" onmouseover="Achievementsbig(this)" onmouseout= | ||
+ | "Achievementsnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/d/db/OxigemAchievements.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 57%; left: 22%; width:8.5%;" onmouseover="Modellingbig(this)" onmouseout= | ||
+ | "Modellingnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/c/cd/OxigemModelling.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 56.5%; left:69.3%; width:7.3%;" onmouseover="Policybig(this)" onmouseout= | ||
+ | "Policynormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/0/0a/OxigemP%26P.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 27%; left: 24.5%; width:8.8%;" onmouseover="iGEMcommbig(this)" onmouseout= | ||
+ | "iGEMcommnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/6/66/OxigemIGEMcomm.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 27.5%; left: 68%; width:6.5%;" onmouseover="Interlabbig(this)" onmouseout= | ||
+ | "Interlabnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/2/27/OxigemInterlab.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 15.3%; left: 40%; width:5%;" onmouseover="Safetybig(this)" onmouseout= | ||
+ | "Safetynormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/safety"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/e/ef/OxigemSafety.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 16.5%; left: 55.5%; width:4.4%;" onmouseover="Teambig(this)" onmouseout= | ||
+ | "Teamnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/team"><img src="https://static.igem.org/mediawiki/2014/c/c1/OxigemTeam.png" | ||
+ | style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div id="DCMationwrap" onClick="DCMationHide()" | ||
+ | style="background: rgba(0,0,0,.4); position: fixed; top:0; left: 0; right: 0; bottom: 0; display:none"> | ||
+ | <div class="Heading" id="DCMationpopup" style= | ||
+ | "left: 37.15%; width:26%; position:absolute; margin-top:12.5%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/3/3c/OxigemDcmationsub.png" style="width: 100%;"> | ||
+ | |||
+ | <div class="Heading" style="top: 13.8%; left: 31%; width:38%;" onmouseover="Subheadingbig(this)" onmouseout= | ||
+ | "Subheadingnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/ouridea"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/1/1f/OxigemAbstract.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 32.6%; left: 30.9%; width:38%;" onmouseover="Subheadingbig(this)" onmouseout= | ||
+ | "Subheadingnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/notebook"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/4/49/OxigemBiodetection.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 50.57%; left: 31%; width:38%;" onmouseover="Subheadingbig(this)" onmouseout= | ||
+ | "Subheadingnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/notebook"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/8/80/OxigemBioremediation.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="Heading" style="top: 69.5%; left: 30%; width:38%;" onmouseover="Subheadingbig(this)" onmouseout= | ||
+ | "Subheadingnormal(this)" border="0"> | ||
+ | <a href="https://2014.igem.org/Team:Oxford/notebook"><img src= | ||
+ | "https://static.igem.org/mediawiki/2014/f/f7/OxigemRealisation.png" style="width: 100%;"></a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 13:56, 4 September 2014