Team:Calgary/Sandbox

From 2010.igem.org

(Difference between revisions)
 
(58 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<head>
+
<head>
-
<script type="text/javascript">
+
<title> iGEM Information Tabs </title>
-
// Copyright 2006-2007 javascript-array.com
+
<script type="text/javascript" src="http://www.wikiwikiwebworks.ca/script1.js"></script>
 +
-
var timeout = 500;
+
<style>
-
var closetimer = 0;
+
-
var ddmenuitem = 0;
+
</style>
-
// open hidden layer
+
</head>
-
function mopen(id) {
+
-
// cancel close timer
+
-
mcancelclosetime();
+
-
// close old layer
 
-
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
 
-
// get new layer and show it
 
-
ddmenuitem = document.getElementById(id);
 
-
ddmenuitem.style.visibility = 'visible';
 
-
}
+
<body>
-
// close showed layer
+
-
function mclose() {
+
-
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
+
-
}
+
-
// go close timer
 
-
function mclosetime() {
 
-
closetimer = window.setTimeout(mclose, timeout);
 
-
}
 
-
// cancel close timer
 
-
function mcancelclosetime() {
 
-
if(closetimer) {
 
-
window.clearTimeout(closetimer);
 
-
closetimer = null;
 
-
}
 
-
}
 
-
// close layer when click-out
+
<!-- text division -->
-
document.onclick = mclose;  
+
 +
<div style="margin-left:auto; margin-right:auto; background:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Background.png'); width:556px; height:330px; padding-top:15px; ">
 +
 +
<div id="0" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:block ">
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 +
<img id="boximage1" src="http://www.army.forces.gc.ca/cfb_suffield/Images/CFB_Suffield1.gif"></img>
 +
 +
</div>
-
</script>
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
<body>
+
 +
<p style="padding-left:10px;">On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.</p>
 +
 +
</div>
 +
 +
</div>
-
<style type="text/css">
+
-
#nav {
+
<div id="1" style="background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
margin: 0;
+
-
padding: 0;
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
z-index: 30;
+
-
}
+
<img id="boximage2" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ImageTBA-1.png"></img>
 +
</div>
-
#nav li {
+
-
margin: 0;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
padding: 0;
+
-
list-style: none;
+
<p style="padding-left:10px;"> I'm generic information about Lethbridge! </p>
-
float: left;
+
-
font: bold 11px arial;
+
</div>
-
}
+
 +
</div>
-
#nav li a {
+
-
display: block;
+
-
margin: 0 1px 0 0;
+
-
padding: 4px 10px;
+
-
width: 60px;
+
-
background: #FF0000;
+
-
color: #FFF;
+
-
text-align: center;
+
-
text-decoration: none;
+
-
}
+
-
#nav li a:hover {
+
<div id="2" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
background: #00FF00;
+
-
}
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
#nav div {
+
<img id="boximage3" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/bhsgrnsmall.png"></img>
-
position: absolute;
+
-
visibility: hidden;
+
</div>
-
margin: 0;
+
-
padding: 0;
+
-
background: #00FFFF;
+
-
border: 1px solid #000000;
+
-
}
+
-
#nav div a {
+
-
position: relative;
+
-
display: block;
+
-
margin: 0;
+
-
padding: 5px 10px;
+
-
width: auto;
+
-
white-space: nowrap;
+
-
text-align: left;
+
-
text-decoration: none;
+
-
background: #FFFF00;
+
-
color: #000000;
+
-
font: 11px arial;
+
-
}
+
-
#nav div a:hover {
+
-
background: #FF00FF;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
color: #FFF;
+
-
}
+
-
</style>
+
<p style="padding-left:10px;"> I'm like burning man but better! </p>
 +
 +
</div>
 +
 +
</div>
-
<ul id="nav">
+
-
<li>
+
-
<a href="#"
+
-
onmouseover="mopen('m1')"
+
-
onmouseout="mclosetime()">
+
-
Home</a>
+
-
<div id="m1"
+
-
onmouseover="mcancelclose()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">News</a>
+
-
</div>
+
-
</li>
+
-
<li>
+
<div id="3" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
<a href="#"
+
-
onmouseover="mopen('m2')"
+
-
onmouseout="mclosetime()">
+
-
Team</a>
+
-
<div id="m2"
+
-
onmouseover="mcancelclose()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">Undergraduates</a>
+
-
<a href="#">Advisors</a>
+
-
<a href="#">About the University</a>
+
-
</div>
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
</li>
+
 +
<img id="boximage4" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProtocolIcon.png"></img>
 +
 +
</div>
-
<li>
 
-
<a href="#"
 
-
onmouseover="mopen('m3')"
 
-
onmouseout="mclosetime()">
 
-
Project</a>
 
-
<div id="m3"
 
-
onmouseover="mcancelclose()"
 
-
onmouseout="mclosetime()">
 
-
<a href="#">Project Overview</a>
 
-
<a href="#">Protein Expression Detector</a>
 
-
<a href="#">Modelling</a>
 
-
</div>
 
-
</li>
 
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 +
<p style="padding-left:10px;"> I'm a fan of cupcakes! </p>
 +
 +
</div>
 +
 +
</div>
 +
 +
 +
 +
<div id="4" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 +
<img id="boximage5" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
 +
 +
</div>
 +
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 +
<p style="padding-left:10px;"> I'm from Alberta and I'm awesome! </p>
 +
 +
</div>
 +
 +
</div>
 +
 +
 +
</div>
 +
 +
 +
 +
<!-- menu bar -->
 +
 +
<div style="width:524px; height:35px; margin-right:auto; margin-left:auto; margin-top:-10px; padding-left:10px; ">
 +
 +
 +
<div onmouseover="imgHover(1);" onmouseout="imgOff(1);" onclick="changeTab(0);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="suffield" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SuffieldWhite.png" title="suffield" /> </div>
 +
 +
 +
<div onmouseover="imgHover(2);" onmouseout="imgOff(2);" onclick="changeTab(1);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="lethbridge" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/LethbridgeGrey.png" title="lethbridge" /> </div>
-
<li><a href="#"
+
-
onmouseover="mopen('m4')"
+
<div onmouseover="imgHover(3);" onmouseout="imgOff(3);" onclick="changeTab(2);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="proteinman" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProteinManGrey.png" title="protein man" /> </div>
-
onmouseout="mclosetime()">
+
-
Parts Submitted</a>
+
-
<div id="m4">
+
-
<a href="#">Team Favourites</a>
+
-
<a href="#">Other Parts</a>
+
-
</div>
+
-
</li>
+
-
<li><a href="#"
 
-
onmouseover="mopen('m5')"
 
-
onmouseout="mclosetime()">
 
-
Notebook</a>
 
-
<div id="m5">
 
-
<a href="#">Ethics</a>
 
-
<a href="#">Outreach</a>
 
-
<a href="#">Gallery</a>
 
-
</div>
 
-
</li>
 
-
<li><a href="#"
+
<div onmouseover="imgHover(4);" onmouseout="imgOff(4);" onclick="changeTab(3);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="community" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/CommunityGrey.png" title="bake sale" /> </div>
-
onmouseover="mopen('m5')"
+
-
onmouseout="mclosetime()">
+
-
Community</a>
+
-
<div id="m5">
+
-
<a href="#">Ethics</a>
+
-
<a href="#">Outreach</a>
+
-
<a href="#">Gallery</a>
+
-
</div>
+
-
</li>
+
-
<li><a href="#">Sponsors</a></li>
+
-
</ul>
+
<div onmouseover="imgHover(5);" onmouseout="imgOff(5);" onclick="changeTab(4);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="agem" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/aGEMGrey.png" title="aGEM" /> </div>
 +
 +
</div>
-
<br/><br/><br/><br/><br/><br/><br/>
 
-
</body>
 
 +
</body>
</html>
</html>

Latest revision as of 06:48, 25 October 2010

iGEM Information Tabs

On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.

I'm generic information about Lethbridge!

I'm like burning man but better!

I'm a fan of cupcakes!

I'm from Alberta and I'm awesome!