Team:Hong Kong CUHK/Project

From 2013.igem.org

(Difference between revisions)
(→Overall project)
Line 1: Line 1:
-
<!-- *** What falls between these lines is the Alert Box!  You can remove it from your pages once you have read and understood the alert *** -->
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
<html xmlns="http://www.w3.org/1999/xhtml">
 +
<head>
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
<title>iGEM CUHK</title>
 +
<link href="slideshow.css" rel="stylesheet" type="text/css"/>
 +
<script type="text/javascript" src="js/jquery-2.0.2.min.js"></script>
 +
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
 +
<script type="text/javascript">
 +
    $('#slider').cycle({
 +
    fx:    'scrollHorz', /* Change the fx 'fade' to 'scrollHorz' if you want*/
 +
    speed:  'slow',
 +
    timeout: 3000,
 +
    next:  '#next',
 +
    prev:  '#prev'
 +
});
 +
</script>
 +
<script type="text/javascript">
 +
<!--
 +
function MM_showHideLayers() { //v9.0
 +
  var i,p,v,obj,args=MM_showHideLayers.arguments;
 +
  for (i=0; i<(args.length-2); i+=3)
 +
  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
 +
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
 +
    obj.visibility=v; }
 +
}
 +
//-->
 +
</script>
-
<html>
+
<style type="text/css">
-
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #fe2b33;">
+
<!--
-
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
+
#wrapper {
-
This is a template page. READ THESE INSTRUCTIONS.
+
        display: block;
 +
        margin: auto;
 +
        height: 720px;
 +
        width: 960px;
 +
}
 +
#container {
 +
        overflow: auto;
 +
}
 +
#slider {
 +
display: block;
 +
float: left;
 +
height: 324px;
 +
width: 100%;
 +
overflow: hidden;
 +
position: absolute;
 +
left: 0%;
 +
}
 +
#prev {
 +
      background-image: url(images/leftArrow.png);
 +
background-repeat: no-repeat;
 +
background-position: center center;
 +
display: block;
 +
float: left;
 +
height: 324px;
 +
width: 40px;
 +
position: relative;
 +
z-index: 99;
 +
}
 +
#next {
 +
background-image: url(images/rightArrow.png);
 +
background-repeat: no-repeat;
 +
background-position: center center;
 +
display: block;
 +
float: right;
 +
height: 324px;
 +
width: 40px;
 +
position: relative;
 +
z-index: 99;
 +
}
 +
h1 {
 +
font-family:"Britannic Bold";
 +
font-size: 20pt;
 +
font-weight: 600;
 +
color: #660099;
 +
}
 +
p1 {
 +
font-family:Tahoma, Geneva, sans-serif;
 +
font-size: 12pt;
 +
font-weight: 300;
 +
color: #FFFFFF;
 +
}
 +
#banner {
 +
margin: 0px;
 +
padding: 0px;
 +
background: #660099;
 +
font-family: 'Open Sans', sans-serif;
 +
font-size: 12pt;
 +
font-weight: 300;
 +
color: #000000;
 +
}
 +
#middle {
 +
margin: 0px;
 +
padding: 0px;
 +
background: #FFF;
 +
font-family: 'Open Sans', sans-serif;
 +
font-size: 12pt;
 +
font-weight: 300;
 +
color: #000000;
 +
}
 +
#footer {
 +
margin: 0px;
 +
padding: 0px;
 +
background: #660099;
 +
font-family: 'Open Sans', sans-serif;
 +
font-size: 12pt;
 +
font-weight: 300;
 +
color: #660099;
 +
}
 +
#logocontainer {
 +
position: absolute;
 +
top: 0px;
 +
width: 100%;
 +
height: 170px;
 +
z-index: 1;
 +
background-color: #660099;
 +
font-family: "Open Sans", sans-serif;
 +
}
 +
#iGEMlogo {
 +
position:absolute;
 +
left:20px;
 +
top:0px;
 +
width:210px;
 +
height:170px;
 +
z-index:2;
 +
}
 +
#swLogo {
 +
position:relative;
 +
margin:0px auto;
 +
top:0px;
 +
width:292px;
 +
height:170px;
 +
z-index:2;
 +
}
 +
#CUHKlogo {
 +
position:absolute;
 +
right:70px;
 +
top:0px;
 +
width:126px;
 +
height:170px;
 +
z-index:2;
 +
}
 +
#containerX1{
 +
position:relative;
 +
width:1000px;
 +
height:330px;
 +
z-index:1;
 +
background-color: #660099;
 +
}
 +
#containerX2{
 +
position:relative;
 +
width:1000px;
 +
height:910px;
 +
z-index:1;
 +
background-color: #FFF;
 +
}
 +
#containerX3{
 +
position:relative;
 +
width:1000px;
 +
height:100px;
 +
z-index:1;
 +
background-color: #660099;
 +
}
 +
#buttons {
 +
position: absolute;
 +
left: 0px;
 +
top: 185px;
 +
width: 100%;
 +
height: 115px;
 +
z-index: 2;
 +
background-color: #660099;
 +
}
 +
#buttonsExt {
 +
position: absolute;
 +
left: 0;
 +
top: 300px;
 +
width: 100%;
 +
height: 30px;
 +
z-index: 2;
 +
background-color: #660099;
 +
font-family: "Britannic Bold";
 +
color: #FF0;
 +
}
 +
 
 +
#search {
 +
position: absolute;
 +
left: 0;
 +
top: 330px;
 +
width: 100%;
 +
height: 30px;
 +
z-index: 2;
 +
background-color: #660099;
 +
}
 +
#photoDisplay {
 +
position:absolute;
 +
left:1%;
 +
top:10px;
 +
width:48%;
 +
height:324px;
 +
z-index:2;
 +
}
 +
#Youtube {
 +
position:absolute;
 +
left:51%;
 +
top:10px;
 +
width:48%;
 +
height:324px;
 +
z-index:2;
 +
}
 +
#VoltSsurface {
 +
position: absolute;
 +
left: 1%;
 +
top: 354px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #FFFFFF;
 +
color: #000;
 +
font-family: "Open Sans", sans-serif;
 +
}
 +
#PAHsurface {
 +
position: absolute;
 +
left: 51%;
 +
top: 354px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #FFFFFF;
 +
color: #000;
 +
}
 +
#VoltSunder {
 +
position:absolute;
 +
left:1%;
 +
top:354px;
 +
width:48%;
 +
height:140px;
 +
z-index:3;
 +
visibility: hidden;
 +
background-color: #660099;
 +
}
 +
#PAHunder {
 +
position:absolute;
 +
left:51%;
 +
top:354px;
 +
width:48%;
 +
height:140px;
 +
z-index:3;
 +
visibility: hidden;
 +
background-color: #660099;
 +
}
 +
#apDiv1 {
 +
position:absolute;
 +
left:45px;
 +
top:485px;
 +
width:811px;
 +
height:164px;
 +
z-index:4;
 +
}
 +
#sponsor {
 +
position: absolute;
 +
left: 1%;
 +
top: 674px;
 +
width: 98%;
 +
height: 200px;
 +
z-index: 2;
 +
background-color: #FFFFFF;
 +
color: #000;
 +
}
 +
#copyright {
 +
position:absolute;
 +
left:0;
 +
top:890px;
 +
width:100%;
 +
height:20px;
 +
z-index:4;
 +
}
 +
#BGVS {
 +
position: absolute;
 +
left: 1%;
 +
top: 514px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #FFFFFF;
 +
color: #000;
 +
}
 +
#BGPAH {
 +
position: absolute;
 +
left: 51%;
 +
top: 514px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #FFFFFF;
 +
color: #000;
 +
}
 +
#BGVSunder {
 +
position: absolute;
 +
left: 1%;
 +
top: 514px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #990066;
 +
color: #000;
 +
visibility: hidden;
 +
}
 +
#BGPAHunder {
 +
position: absolute;
 +
left: 51%;
 +
top: 514px;
 +
width: 48%;
 +
height: 140px;
 +
z-index: 2;
 +
background-color: #990066;
 +
color: #000;
 +
visibility: hidden;
 +
}
 +
.buttonbar{
 +
width:100%;
 +
height:100%;
 +
position:absolute;
 +
left:0;
 +
top:0;
 +
z-index:3;
 +
font-size:20px;
 +
color:#FFFFFF;
 +
background-color: #660099;
 +
visibility: hidden;
 +
}
 +
#one{
 +
text-indent:0px;
 +
}
 +
#teamEXT{
 +
text-indent:10%;
 +
}
 +
#projectEXT{
 +
text-indent:20%;
 +
}
 +
#biobrickEXT{
 +
text-indent:30%;
 +
}
 +
#fiv{
 +
text-indent:45%;
 +
}
 +
#six{
 +
text-indent:56%;
 +
}
 +
#docEXT{
 +
text-indent:70%;
 +
}
 +
#eig{
 +
  text-align:right;
 +
}
 +
.menubar{
 +
width:10%;
 +
height:100%;
 +
position:absolute;
 +
top:0;
 +
z-index:4;
 +
}
 +
#homeUP{
 +
left:0px;
 +
}
 +
#homeDOWN{
 +
left:0px;
 +
visibility: hidden;
 +
}
 +
#teamUP{
 +
left:10%;
 +
}
 +
#teamDOWN{
 +
left:10%;
 +
visibility: hidden;
 +
}
 +
#projectUP{
 +
left:20%;
 +
}
 +
#projectDOWN{
 +
left:20%;
 +
visibility: hidden;
 +
}
 +
#biobrickUP{
 +
left:30%;
 +
}
 +
#biobrickDOWN{
 +
left:30%;
 +
visibility: hidden;
 +
}
 +
#hpUP{
 +
left:40%;
 +
}
 +
#hpDOWN{
 +
left:40%;
 +
visibility: hidden;
 +
}
 +
#modelUP{
 +
left:50%;
 +
}
 +
#modelDOWN{
 +
left:50%;
 +
visibility: hidden;
 +
}
 +
#safetyUP{
 +
left:60%;
 +
}
 +
#safetyDOWN{
 +
left:60%;
 +
visibility: hidden;
 +
}
 +
#docUP{
 +
left:70%;
 +
}
 +
#docDOWN{
 +
left:70%;
 +
visibility: hidden;
 +
}
 +
#galleryUP{
 +
left:80%;
 +
}
 +
#galleryDOWN{
 +
left:80%;
 +
visibility: hidden;
 +
}
 +
#ackUP{
 +
left:90%;
 +
}
 +
#ackDOWN{
 +
left:90%;
 +
visibility: hidden;
 +
}
 +
 
 +
.linkEXT{color:#FFFFFF;}
 +
.linkEXT:visited{color:#CCC;}
 +
.linkEXT:hover{color:#FF0;}
 +
.linkEXT:active{color:#FFFFFF;}
 +
 
 +
-->
 +
</style>
 +
</head>
 +
 
 +
<body>
 +
 
 +
<div id="banner">
 +
<div id="containerX1" style="margin: 0px auto;">
 +
<div id="logocontainer">
 +
  <div id="iGEMlogo"><a href="https://2013.igem.org"><img src="images/IGEM_Logo.png" width="209" height="170" /></a></div>
 +
  <div id="swLogo"><a href="../index.html"><img src="images/switch_pah4.png" width="292" height="170" /></a></div>
 +
  <div id="CUHKlogo"><a href="../index.html"><img src="images/right_logo2.png" width="126" height="170" /></a></div>
</div>
</div>
-
<div id="instructions" style="text-align: center; font-weight: normal; font-size: small; color: #f6f6f6; padding: 5px;">
+
 
-
You are provided with this team page template with which to start the iGEM season. You may choose to personalize it to fit your team but keep the same "look." Or you may choose to take your team wiki to a different level and design your own wiki. You can find some examples <a href="https://2008.igem.org/Help:Template/Examples">HERE</a>.
+
<div id="buttons">
-
</div>
+
<div class="menubar" id="homeUP"><img src="images/home ps.png" width="100" height="115" onmouseover="MM_showHideLayers('homeUP','','hide','homeDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')" /></div>
-
<div id="warning" style="text-align: center; font-weight: bold; font-size: small; color: #f6f6f6; padding: 5px;">
+
<div class="menubar" id="homeDOWN"><a href="index.html"><img src="images/home psB.png" width="100" height="115" onmouseout="MM_showHideLayers('homeDOWN','','hide','homeUP','','show')"/></a></div>
-
You <strong>MUST</strong> have all of the pages listed in the menu below with the names specified. PLEASE keep all of your pages within your teams namespace.
+
<div class="menubar" id="teamUP"><img src="images/team ps.png" width="100" height="115" onmouseover="MM_showHideLayers('teamUP','','hide','teamDOWN','','show');MM_showHideLayers('teamEXT','','show','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="teamDOWN"><a href="team.html"><img src="images/team psB.png" width="100" height="115" onmouseout="MM_showHideLayers('teamDOWN','','hide','teamUP','','show')"/></a></div>
 +
<div class="menubar" id="projectUP"><img src="images/project ps.png" width="100" height="115" onmouseover="MM_showHideLayers('projectUP','','hide','projectDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','show','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="projectDOWN"><a href="project.html"><img src="images/project psB.png" width="100" height="115" onmouseout="MM_showHideLayers('projectDOWN','','hide','projectUP','','show')"/></a></div>
 +
<div class="menubar" id="biobrickUP"><img src="images/biobrick ps.png" width="100" height="115" onmouseover="MM_showHideLayers('biobrickUP','','hide','biobrickDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','show','docEXT','','hide')"/></div>
 +
<div class="menubar" id="biobrickDOWN"><a href="biobrick.html"><img src="images/biobrick psB.png" width="100" height="115" onmouseout="MM_showHideLayers('biobrickDOWN','','hide','biobrickUP','','show')"/></a></div>
 +
<div class="menubar" id="hpUP"><img src="images/human practice ps.png" width="100" height="115" onmouseover="MM_showHideLayers('hpUP','','hide','hpDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="hpDOWN"><a href="hp.html"><img src="images/human practice psB.png" width="100" height="115" onmouseout="MM_showHideLayers('hpDOWN','','hide','hpUP','','show')"/></a></div>
 +
<div class="menubar" id="modelUP"><img src="images/modelling.png" width="100" height="115" onmouseover="MM_showHideLayers('modelUP','','hide','modelDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="modelDOWN"><a href="model.html"><img src="images/modellingB.png" width="100" height="115" onmouseout="MM_showHideLayers('modelDOWN','','hide','modelUP','','show')"/></a></div>
 +
<div class="menubar" id="safetyUP"><img src="images/safety ps.png" width="100" height="115" onmouseover="MM_showHideLayers('safetyUP','','hide','safetyDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="safetyDOWN"><a href="safety.html"><img src="images/safety psB.png" width="100" height="115" onmouseout="MM_showHideLayers('safetyDOWN','','hide','safetyUP','','show')"/></a></div>
 +
<div class="menubar" id="docUP"><img src="images/documentation ps.png" width="100" height="115" onmouseover="MM_showHideLayers('docUP','','hide','docDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','show')"/></div>
 +
<div class="menubar" id="docDOWN"><a href="doc.html"><img src="images/documentation psB.png" width="100" height="115" onmouseout="MM_showHideLayers('docDOWN','','hide','docUP','','show')"/></a></div>
 +
<div class="menubar" id="galleryUP"><img src="images/gallery ps.png" width="100" height="115" onmouseover="MM_showHideLayers('galleryUP','','hide','galleryDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="galleryDOWN"><a href="gallery.html"><img src="images/gallery psB.png" width="100" height="115" onmouseout="MM_showHideLayers('galleryDOWN','','hide','galleryUP','','show')"/></a></div>
 +
<div class="menubar" id="ackUP"><img src="images/ack ps.png" width="100" height="115" onmouseover="MM_showHideLayers('ackUP','','hide','ackDOWN','','show');MM_showHideLayers('teamEXT','','hide','projectEXT','','hide','biobrickEXT','','hide','docEXT','','hide')"/></div>
 +
<div class="menubar" id="ackDOWN"><a href="ack.html"><img src="images/ack psB.png" width="100" height="115" onmouseout="MM_showHideLayers('ackDOWN','','hide','ackUP','','show')"/></a></div>
</div>
</div>
 +
 +
<div id="buttonsExt">
 +
<div class="buttonbar" id="one"></div>
 +
<div class="buttonbar" id="teamEXT"><a href="member.html" class="linkEXT">Team Members</a> | <a href="ianda.html" class="linkEXT">Instructors and Advisors</a></div>
 +
<div class="buttonbar" id="projectEXT"><a href="pah.html" class="linkEXT">PAH Degradtion</a> | <a href="vs.html" class="linkEXT">Voltage Switch</a></div>
 +
<div class="buttonbar" id="biobrickEXT"><a href="parts.html" class="linkEXT">Parts</a> | <a href="construction.html" class="linkEXT">Construction Notes</a> | <a href="character.html" class="linkEXT">Characterizations</a></div>
 +
<div class="buttonbar" id="fiv"></div>
 +
<div class="buttonbar" id="six"></div>
 +
<div class="buttonbar" id="docEXT"><a href="protocol.html" class="linkEXT">Protocols</a> | <a href="notebook.html" class="linkEXT">Notebooks</a></div>
 +
<div class="buttonbar" id="eig"></div>
</div>
</div>
-
</html>
 
-
<!-- *** End of the alert box *** -->
 
 +
</div>
-
{| style="color:#1b2c8a;background-color:#0c6;" cellpadding="3" cellspacing="1" border="1" bordercolor="#fff" width="62%" align="center"
+
<div id="middle">
-
!align="center"|[[Team:Hong_Kong_CUHK|Home]]
+
<div id="containerX2" style="margin: 0px auto;">
-
!align="center"|[[Team:Hong_Kong_CUHK/Team|Team]]
+
<div id="photoDisplay">
-
!align="center"|[https://igem.org/Team.cgi?year=2013&team_name=Hong_Kong_CUHK Official Team Profile]
+
<div id="container">
-
!align="center"|[[Team:Hong_Kong_CUHK/Project|Project]]
+
  <div class="controller" id="prev"></div>
-
!align="center"|[[Team:Hong_Kong_CUHK/Parts|Parts Submitted to the Registry]]
+
        <div id="slider">
-
!align="center"|[[Team:Hong_Kong_CUHK/Modeling|Modeling]]
+
            <img src="images/P1050715.JPG" width="480" height="324">
-
!align="center"|[[Team:Hong_Kong_CUHK/Notebook|Notebook]]
+
            <img src="images/20130619_163521.jpg" width="480" height="324">
-
!align="center"|[[Team:Hong_Kong_CUHK/Safety|Safety]]
+
            <img src="images/P1050650.JPG" width="480" height="324">
-
!align="center"|[[Team:Hong_Kong_CUHK/Attributions|Attributions]]
+
            <img src="images/P1050728.JPG" width="480" height="324">
-
|}
+
            <img src="images/P1050736.JPG" width="480" height="324">
 +
  </div>
 +
        <div class="controller" id="next"></div>
 +
  </div>
 +
</div>
 +
<div id="Youtube"><object width="480" height="324"><param name="movie" value="http://www.youtube.com/v/w-k8dzTmuNk?version=3&amp;hl=zh_TW&amp;"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/w-k8dzTmuNk?version=3&amp;hl=zh_TW&amp" width="480" height="324" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" movie="http://www.youtube.com/v/w-k8dzTmuNk?version=3&amp;hl=zh_TW&amp"></embed></object></div>
 +
<div id="VoltSsurface" onmouseover="MM_showHideLayers('VoltSsurface','','hide','VoltSunder','','show')">
 +
  <h1>Voltage Switch</h1></div>
 +
<div id="PAHsurface" onmouseover="MM_showHideLayers('PAHsurface','','hide','PAHunder','','show')"><h1>PAH Degradation</h1></div>
 +
<div id="VoltSunder" onmouseout="MM_showHideLayers('VoltSsurface','','show','VoltSunder','','hide')"><p1>This is the dark side of VS!!!</p1></div>
 +
<div id="PAHunder" onmouseout="MM_showHideLayers('PAHsurface','','show','PAHunder','','hide')"><p1>This is the dark side of PAH!!!</p1></div>
 +
<div id="sponsor"><h1>Sponsor list</h1></div>
-
== '''Overall project''' ==
+
<div id="copyright">
 +
  <div align="center"></div>
 +
</div>
 +
<div id="BGVS" onmouseover="MM_showHideLayers('BGVS','','hide','BGVSunder','','show')"><h1>Background of VS</h1></div>
 +
<div id="BGPAH" onmouseover="MM_showHideLayers('BGPAH','','hide','BGPAHunder','','show')"><h1>Background of PAH</h1></div>
 +
<div id="BGVSunder" onmouseout="MM_showHideLayers('BGVS','','show','BGVSunder','','hide')"><h1>This is the dark side of VSBG!!</h1></div>
 +
<div id="BGPAHunder" onmouseout="MM_showHideLayers('BGPAH','','show','BGPAHunder','','hide')"><h1>This is the dark side of PAHBG!!</h1></div>
 +
</div>
 +
</div>
-
Tell us more about your project.  Give us background.  Use this is the abstract of your project.  Be descriptive but concise (1-2 paragraphs)
+
<div id="footer">
 +
<div id="containerX3" style="margin: 0px auto;">
 +
</div>
 +
</div>
-
== Results ==
+
</body>
 +
</html>

Revision as of 15:43, 23 September 2013

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> iGEM CUHK