Team:Calgary/Sandbox

From 2010.igem.org

(Difference between revisions)
 
(21 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<head>
<head>
-
<script type="text/javascript">
 
-
// Copyright 2006-2007 javascript-array.com
+
<title> iGEM Information Tabs </title>
-
var timeout = 500;
+
<script type="text/javascript" src="http://www.wikiwikiwebworks.ca/script1.js"></script>
-
var closetimer = 0;
+
-
var ddmenuitem = 0;
+
-
// open hidden layer
+
<style>
-
function mopen(id)
+
-
{
+
</style>
-
// 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';
+
-
+
-
}
+
-
// 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
+
</head>
-
document.onclick = mclose;
+
-
</script>
 
-
<style>
 
-
div.bannerContainer{
+
<body>
-
width: 975px;
+
-
height: 275px;
+
-
margin-left: -5px;
+
-
margin-top: -56px;
+
-
background-color: #FFFFFF;
+
-
}
+
-
div.langButton{
 
-
width: 975px;
 
-
height: 44px;
 
-
margin: 0px;
 
-
position: relative;
 
-
background-color: #FFFFFF;
 
-
}
 
-
img.bannerImage{
+
<!-- text division -->
-
margin-top: 0px;
+
-
}
+
<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>
-
div.menuBar{
 
-
margin-left: -5px;
 
-
width: 975px;
 
-
height: 25px;
 
-
}
+
<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;">On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.</p>
 +
 +
</div>
 +
 +
</div>
 +
-
#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;
+
-
position: relative;
+
<img id="boximage2" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ImageTBA-1.png"></img>
-
}
+
</div>
-
+
-
#nav li {
+
-
margin: 0;
+
-
padding: 0;
+
-
list-style: none;
+
-
float: left;
+
-
font: bold 11px arial;
+
-
}
+
-
#nav li a {
+
-
display: block;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
margin: 0 0 0 0;
+
-
padding: 6px 10px;
+
<p style="padding-left:10px;"> I'm generic information about Lethbridge! </p>
-
width: 80px;
+
-
background: #FFFFFF;
+
</div>
-
color: #000;
+
-
text-align: center;
+
</div>
-
text-decoration: none;
+
-
border-right: 2px solid black;
+
-
}
+
-
#nav li a:hover {
+
<div id="2" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
background: #FFFFFF;
+
-
color: #000;
+
<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: #1A1A1A;
+
-
}
+
-
#nav div a {
+
-
position: relative;
+
-
display: block;
+
-
margin: 0;
+
-
padding: 5px 10px;
+
-
width: 150px;
+
-
white-space: nowrap;
+
-
text-align: left;
+
-
text-decoration: none;
+
-
background: #FFFFFF;
+
-
color: #000;
+
-
font: 11px arial;
+
-
}
+
-
#nav div a:hover {
+
-
background: #FFFFFF;
+
<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: #000;
+
-
}
+
-
div.tabBox{
+
<p style="padding-left:10px;"> I'm like burning man but better! </p>
-
float: left;
+
-
width: 530px;
+
</div>
-
height: 360px;
+
-
margin: 5px;
+
</div>
-
margin-top: 10px;
+
-
margin-right: 0;
+
-
border: 1px solid green;
+
-
}
+
-
div.miniBar{
+
-
float: left;
+
-
height: 360px;
+
-
width: 400px;
+
-
margin-top: 10px;
+
-
margin-left: 15px;
+
-
}
+
-
div.countdown{
+
<div id="3" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
width: 356px;
+
-
margin-left: auto;
+
-
margin-right: auto;
+
-
border: 2px solid black;
+
-
}
+
-
div.miniContainer{
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
width: 360px;
+
-
margin-left: auto;
+
<img id="boximage4" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProtocolIcon.png"></img>
-
margin-right: auto;
+
-
}
+
</div>
-
div.miniContainer img{
+
-
width: 360px;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
height: 120px;
+
-
}
+
-
</style>
+
<p style="padding-left:10px;"> I'm a fan of cupcakes! </p>
-
</head>
+
-
 
+
-
 
+
-
<body>
+
-
<div class="bannerContainer">
+
-
<div class="langButton">
+
-
</div>
+
</div>
 +
 +
</div>
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/header-1.png" class="bannerImage" title="University of Calgary iGEM Team 2010">
+
-
</img>
+
-
</div>
+
-
<div class="menuBar">
+
<div id="4" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
<ul id="nav">
+
-
<li>
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
<a href="https://2010.igem.org/Team:Calgary"
+
-
onmouseover="mopen('m1')"
+
-
onmouseout="mclosetime()">
+
-
Home</a>
+
-
</li>
+
-
<li>
+
<img id="boximage5" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
-
<a href="#"
+
-
onmouseover="mopen('m2')"
+
</div>
-
onmouseout="mclosetime()">
+
-
Team</a>
+
-
<div id="m2"
+
-
onmouseover="mcancelclosetime()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">Biographies</a>
+
-
<a href="#">Facilitators</a>
+
-
<a href="#">Photographs</a>
+
-
<a href="#">About the University</a>
+
-
<a href="#">Acknowledgements</a>
+
-
</div>
+
-
</li>
+
-
<li>
 
-
<a href="#"
 
-
onmouseover="mopen('m3')"
 
-
onmouseout="mclosetime()">
 
-
Project</a>
 
-
<div id="m3"
 
-
onmouseover="mcancelclosetime()"
 
-
onmouseout="mclosetime()">
 
-
<a href="#">Transcription/Translation</a>
 
-
<a href="#">Cpx Circuit</a>
 
-
<a href="#">IbpAB Circuit</a>
 
-
<a href="#">Abstract</a>
 
-
<a href="#">Introduction</a>
 
-
<a href="#">Results</a>
 
-
<a href="#">Discussion</a>
 
-
<a href="#">References</a>
 
-
<a href="#">Acknowledgements</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;">
-
<li><a href="#"
+
<p style="padding-left:10px;"> I'm from Alberta and I'm awesome! </p>
-
onmouseover="mopen('m4')"
+
-
onmouseout="mclosetime()">
+
</div>
-
Parts</a>
+
-
<div id="m4"
+
</div>
-
onmouseover="mcancelclosetime()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">Parts Submitted</a>
+
-
<a href="#">Team Favourites</a>
+
-
<a href="#">Characterization</a>
+
-
</div>
+
-
</li>
+
-
<li><a href="#"
+
</div>
-
onmouseover="mopen('m5')"
+
-
onmouseout="mclosetime()">
+
-
Notebook</a>
+
-
<div id="m5"
+
-
onmouseover="mcancelclosetime()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">Calendar</a>
+
-
<a href="#">Brainstorming</a>
+
-
<a href="#">Safety and Protocols</a>
+
-
</div>
+
-
</li>
+
-
<li><a href="#">
 
-
Modelling</a>
 
-
</li>
 
 +
<!-- menu bar -->
 +
 +
<div style="width:524px; height:35px; margin-right:auto; margin-left:auto; margin-top:-10px; padding-left:10px; ">
-
<li><a href="#"
+
-
onmouseover="mopen('m7')"
+
<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>
-
onmouseout="mclosetime()">
+
-
Community</a>
+
-
<div id="m7"
+
-
onmouseover="mcancelclosetime()"
+
-
onmouseout="mclosetime()">
+
-
<a href="#">Ethics</a>
+
-
<a href="#">Gallery</a>
+
-
<a href="#">DRDC Suffield Trip</a>
+
-
<a href="#">Conferences</a>
+
-
<a href="#">Blog</a>
+
-
</div>
+
-
</li>
+
-
<li><a href="#">Sponsors</a></li>
+
 +
<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>
-
</ul>
+
-
</div>
+
<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>
-
<div class="tabBox">
 
-
</div>
+
<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>
-
<div class="miniBar">
+
-
<div class="countdown"><object type="application/x-shockwave-flash" data="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=000000&bgcolor=FFFFFF&date_month=11&date_day=05&date_year=0&un=THE IGEM JAMBOREE&size=normal&mo=11&da=05&yr=2010" width="356" height="115"><param name="movie" value="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=000000&bgcolor=FFFFFF&date_month=11&date_day=05&date_year=0&un=THE IGEM JAMBOREE&size=normal&mo=11&da=05&yr=2010" /><param name="bgcolor" value="#FFFFFF" /></object><img src="http://www.oneplusyou.com/q/img/bb_badges/countdown.jpg" alt="" style="display: none;" height="1" width="1" /></div>
+
<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 class="miniContainer">
+
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/RecentPhotosTab.png" class="galleryButton"></img>
+
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SponsoroftheMonthButton.png" class="sponsorButton"></img>
+
-
</div>
+
-
</div>
+
 +
</div>
 +
 +
 +
 +
</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!