Team:Hong Kong CUHK/Project

From 2013.igem.org

(Difference between revisions)
(Prototype team page)
(→Project Details)
Line 43: Line 43:
-
== Project Details==
+
<!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>
 +
<style type="text/css">
 +
<!--
 +
#wrapper {
 +
        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>
-
=== Part 2 ===
+
<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 id="buttons">
 +
<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 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>
 +
<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 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>
-
=== The Experiments ===
+
</div>
 +
<div id="middle">
 +
<div id="containerX2" style="margin: 0px auto;">
 +
<div id="photoDisplay">
 +
<div id="container">
 +
  <div class="controller" id="prev"></div>
 +
        <div id="slider">
 +
            <img src="images/P1050715.JPG" width="480" height="324">
 +
            <img src="images/20130619_163521.jpg" width="480" height="324">
 +
            <img src="images/P1050650.JPG" width="480" height="324">
 +
            <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>
-
=== Part 3 ===
 
 +
<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>
 +
<div id="footer">
 +
<div id="containerX3" style="margin: 0px auto;">
 +
</div>
 +
</div>
 +
</body>
 +
</html>
== Results ==
== Results ==

Revision as of 15:40, 23 September 2013


This is a template page. READ THESE INSTRUCTIONS.
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 HERE.
You MUST have all of the pages listed in the menu below with the names specified. PLEASE keep all of your pages within your teams namespace.


Home Team Official Team Profile Project Parts Submitted to the Registry Modeling Notebook Safety Attributions



Overall project

Tell us more about your project. Give us background. Use this is the abstract of your project. Be descriptive but concise (1-2 paragraphs)




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