Difference between revisions of "Team:HZAU-China/Project/Description"

Line 1: Line 1:
 +
{{HZAU-China}}
 +
<!DOCTYPE html>
 
<html>
 
<html>
  
 
<head>
 
<head>
−
     <title>test</title>
+
  <meta charset="UTF-8">
 +
  <style type="text/css">
 +
     /* HTML5 display-role reset for older browsers */
 +
 
 +
    article,
 +
    aside,
 +
    details,
 +
    figcaption,
 +
    figure,
 +
    footer,
 +
    header,
 +
    hgroup,
 +
    nav,
 +
    section {
 +
      display: block;
 +
    }
 +
 
 +
    ol,
 +
    ul {
 +
      list-style: none;
 +
    }
 +
 
 +
    blockquote,
 +
    q {
 +
      quotes: none;
 +
    }
 +
 
 +
    blockquote:before,
 +
    blockquote:after,
 +
    q:before,
 +
    q:after {
 +
      content: '';
 +
      content: none;
 +
    }
 +
 
 +
    table {
 +
      border-collapse: collapse;
 +
      border-spacing: 0;
 +
    }
 +
  </style>
 +
  <!--内容的样式-->
 +
  <style>
 +
    body {
 +
      font-family: "Arial", Helvetica, sans-serif;
 +
      text-align: justify;
 +
      margin: 0px;
 +
    }
 +
 
 +
    .HZAU_content {
 +
      position: relative;
 +
      right: 0px;
 +
      width: 1000px;
 +
      height: 3000px;
 +
      margin: 0 0 0 250px;
 +
      z-index: -1;
 +
    }
 +
 
 +
    .HZAU_2017_menu {
 +
      display: block;
 +
      position: fixed;
 +
      left: 15px;
 +
      top: 100px;
 +
      height: 337px;
 +
      width: 233px;
 +
      overflow: hidden;
 +
    }
 +
 
 +
    .beijin {
 +
      height: 337px;
 +
      width: 233px;
 +
    }
 +
 
 +
    .HZAU_2017_menu ul {
 +
      position: absolute;
 +
      top: 50%;
 +
      margin-top: -80px;
 +
      margin-left: 0px;
 +
      left: 0px;
 +
      width: 100%;
 +
      padding-left: 0px;
 +
      font-size: 16px;
 +
    }
 +
 
 +
    .HZAU_2017_menu li {
 +
      width: 100%;
 +
    }
 +
 
 +
    .HZAU_2017_menu li a {
 +
      display: inline-block;
 +
      width: 100%;
 +
      height: 100%;
 +
      padding: 20px 0px 20px 0px;
 +
      margin-left: 13px;
 +
      text-align: left;
 +
      color: rgb(249, 228, 137);
 +
      text-decoration: none;
 +
      font-style: arial;
 +
      line-height: 90%;
 +
    }
 +
 
 +
    .HZAU_2017_menu li:hover {
 +
      background: rgb(249, 228, 137);
 +
    }
 +
 
 +
    .HZAU_2017_menu li a:hover {
 +
      color: #000;
 +
    }
 +
 
 +
    .item {
 +
      width: 100%;
 +
      padding-left: 40px;
 +
 
 +
 
 +
    }
 +
 
 +
    .biaoti {
 +
      font-size: 50px;
 +
      font-weight: bold;
 +
      text-align: center;
 +
      width: 100%;
 +
      display: block;
 +
      padding-bottom: 50px;
 +
      padding-top: 50px;
 +
      color: rgb(63, 59, 58);
 +
    }
 +
 
 +
    .zhengwen {
 +
      font-style: arial;
 +
      font-size: 24px;
 +
      line-height: 120%;
 +
      text-align: justify;
 +
      color: #000;
 +
    }
 +
 
 +
    .zhengwen {
 +
      padding: 33px;
 +
      display: absolute;
 +
      top: -66px;
 +
    }
 +
 
 +
    .tu_1 {
 +
      position: relative;
 +
      left: 450px;
 +
      padding-top: 30px;
 +
      padding-bottom: 30px;
 +
    }
 +
 
 +
    .tu_2 {
 +
      position: relative;
 +
      left: 450px;
 +
      padding-top: 30px;
 +
      padding-bottom: 30px;
 +
    }
 +
  </style>
 
</head>
 
</head>
  
 
<body>
 
<body>
−
    <div style="position:fixed;height:50px;background:#ccc;width:100%;display:none" id="topbar"></div>
+
  <div class="HZAU_2017_menu">
−
     <div style="height:80000px;">content</div>
+
    <img src="https://static.igem.org/mediawiki/2017/8/8e/HZAU_2017_background_1.png" class="beijin">
 +
    <ul class="daohang">
 +
      <li id="HZAU_menu_1">
 +
        <a href="#" id="bianse_1">Background</a>
 +
      </li>
 +
      <li id="HZAU_menu_2">
 +
        <a href="#item2_1" id="bianse_2">Information</a>
 +
      </li>
 +
      <li id="HZAU_menu_3">
 +
        <a href="#item3_1" id="bianse_3">Why light control</a>
 +
      </li>
 +
    </ul>
 +
  </div>
 +
  <div class="HZAU_content wrap">
 +
    <div class="item" id="item1">
 +
      <a class="biaoti">Description</a>
 +
      <a class="zhengwen">In the long history of life evolution, different species living in different environment developed the most adaptive
 +
        surviving mechanism for them under the selection pressure, among which some unmatchable become widly preserved in
 +
        different creatures, and the mechanism of replication is one of them. The majority of prokaryote share the same mechanism
 +
        of self-replication including DNA replication, chromosome seperation and cell division. These three parts comprised
 +
        the whole cell cycle, and the main model creature for researching the replication process is E.coli, which at the
 +
        same time is the main object of our project.</a>
 +
    </div>
 +
    <img src="https://static.igem.org/mediawiki/2017/b/bc/HZAU_2017_tu1_1.png" class="tu_1">
 +
 
 +
    <div class="item" id="item2">
 +
        <div id="item2_1" class="zhengwen"></div>
 +
      <a class="zhengwen">The replication process of E.coli replication can be devided into phase B,C and D, three phases. Phase B, also called
 +
        pre-replication phase, is for DNA replication proparation similar as G1 phase in eukaryote cell cycle. Phase C is
 +
        regarded as replication phase during which the chromosome is replicating corespond to the S phase in eukaryote. The
 +
        last phase, phase D, is called post-replication phase, in which the behave of chromosome seperation and cell division
 +
        happend just like what happened in G2 and M phase of eukaryote cells. the time of C phase and D phase in a generation
 +
        is relative constant, so what actually determines the cell cycle is the initiation of genome replication. We know
 +
        that cell have to garantee that each cell should have at least one chormosome, and this requires a highly coordination
 +
        between DNA replication and cell divsion. Though the delicate mechanism of the corrdination is still a puzzle, it
 +
        is clear that DnaA protein plays a significant role in this event. DnaA is a versatile protein, it can not only behave
 +
        like a helicase opening the duble-helix of replication initiation site, OriC, while have the function of raising
 +
        other proteins forming into the replisome to prolong the replication, but also can anchor the replicationg choromosome
 +
        on the cell membrane leading the following seperation of chromosome. But what makes it the linker between replication
 +
        and division is that its concentration determines the initiation volume of replication. So according to these information,
 +
        we think that regulating the combination of DNA and DnaA protein will be an efficient method to regulate cell replication.
 +
        <a href="">For more information please click here.</a>
 +
      </a>
 +
     </div>
 +
    <img src="https://static.igem.org/mediawiki/2017/5/51/HZAU_2017_tu2_1.png" class="tu_2">
 +
 
 +
    <div class="item" id="item3">
 +
      <div id="item3_1" class="zhengwen"></div>
 +
      <a class="zhengwen">There will be about 1h for an entire genome replication, but cell division can reach about 20min per generation. this
 +
        reflects the multi-copy number of bacterial genome and only with this mechanism can E.coli reproduce in such a high
 +
        speed. what's worse is that even isogenic cells grow in the same culture have a scattering distribution not only
 +
        in phase but also in genome copy number. the strong heterogenic in cell cycle and genome copy number hinds the 3D
 +
        genome research and may be a potential noise on genome gene expression. At the same time, the developing synthetic
 +
        biology requires an approach that can control cell reproduction and can be easily incorporated into circuits, so
 +
        that the whole system can be more safe and controlable. taking these into consider, we decided to use CRISPRi to
 +
        inhibit its cell cycle, for more details please see design.</a>
 +
      <a class="zhengwen">But barely pause the replication in some circumstance can't satisfy our needs, and long time inhibition will prolong
 +
        its length, so there is a need to totally control its replication, not only block but also open. with that purpose
 +
        we decided to use optogentic to control this system, and the operablity of light to computer makes our system programable,
 +
        which can be called 4C.</a>
 +
    </div>
 +
    <a class="ppp"></a>
 +
  </div>
 +
 
 
</body>
 
</body>
−
<script type="text/javascript">
+
<script>
−
    window.onscroll = function () {
+
  document.getElementById("bianse_1").style.color = "black";
−
        var top = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
+
  document.getElementById("HZAU_menu_1").style.backgroundColor = "rgb(249,228,137)";
−
        var node = document.getElementById('topbar');
+
  window.onscroll = function gundong() {
−
         if (top > 500) {
+
    var top = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop,
−
            node.style.display = '';//采用默认值
+
      bianse_1 = document.getElementById("bianse_1"),
−
         } else {
+
      bianse_2 = document.getElementById("bianse_2"),
−
            node.style.display = 'none';
+
      bianse_3 = document.getElementById("bianse_3"),
−
         }
+
      HZAU_menu_1 = document.getElementById("HZAU_menu_1"),
 +
      HZAU_menu_2 = document.getElementById("HZAU_menu_2"),
 +
      HZAU_menu_3 = document.getElementById("HZAU_menu_3");
 +
 
 +
    if (top > 0 && top < 625.8) {
 +
      bianse_1.style.color = "black";
 +
      bianse_2.style.color = "rgb(249,228,137)";
 +
      bianse_3.style.color = "rgb(249,228,137)";
 +
      HZAU_menu_1.style.backgroundColor = "rgb(249,228,137)";
 +
      HZAU_menu_2.style.backgroundColor = "";
 +
      HZAU_menu_3.style.backgroundColor = "";
 +
      bianse_1.onmouseover = function () {
 +
         bianse_1.style.color = "black";
 +
      }
 +
      bianse_1.onmouseout = function () {
 +
        bianse_1.style.color = "black";
 +
      }
 +
      bianse_2.onmouseover = function () {
 +
        bianse_2.style.color = "black";
 +
      }
 +
      bianse_2.onmouseout = function () {
 +
        bianse_2.style.color = "rgb(249,228,137)";
 +
      }
 +
      bianse_3.onmouseover = function () {
 +
        bianse_3.style.color = "black";
 +
      }
 +
      bianse_3.onmouseout = function () {
 +
        bianse_3.style.color = "rgb(249,228,137)";
 +
      }
 +
    }
 +
    if (top >= 625.8 && top < 1605.2) {
 +
      bianse_1.style.color = "rgb(249,228,137)";
 +
      bianse_2.style.color = "black";
 +
      bianse_3.style.color = "rgb(249,228,137)";
 +
      HZAU_menu_1.style.backgroundColor = "";
 +
      HZAU_menu_2.style.backgroundColor = "rgb(249,228,137)";
 +
      HZAU_menu_3.style.backgroundColor = "";
 +
 
 +
      bianse_1.onmouseover = function () {
 +
         bianse_1.style.color = "black";
 +
      }
 +
      bianse_1.onmouseout = function () {
 +
        bianse_1.style.color = "rgb(249,228,137)";
 +
      }
 +
      bianse_2.onmouseover = function () {
 +
         bianse_2.style.color = "black";
 +
      }
 +
      bianse_2.onmouseout = function () {
 +
        bianse_2.style.color = "black";
 +
      }
 +
      bianse_3.onmouseover = function () {
 +
        bianse_3.style.color = "black";
 +
      }
 +
      bianse_3.onmouseout = function () {
 +
        bianse_3.style.color = "rgb(249,228,137)";
 +
      }
 +
    }
 +
    if (top >= 1605.2) {
 +
      bianse_1.style.color = "rgb(249,228,137)";
 +
      bianse_2.style.color = "rgb(249,228,137)";
 +
      bianse_3.style.color = "black";
 +
      HZAU_menu_1.style.backgroundColor = "";
 +
      HZAU_menu_2.style.backgroundColor = "";
 +
      HZAU_menu_3.style.backgroundColor = "rgb(249,228,137)";
 +
      bianse_1.onmouseover = function () {
 +
        bianse_1.style.color = "black";
 +
      }
 +
      bianse_1.onmouseout = function () {
 +
        bianse_1.style.color = "rgb(249,228,137)";
 +
      }
 +
      bianse_2.onmouseover = function () {
 +
        bianse_2.style.color = "black";
 +
      }
 +
      bianse_2.onmouseout = function () {
 +
        bianse_2.style.color = "rgb(249,228,137)";
 +
      }
 +
      bianse_3.onmouseover = function () {
 +
        bianse_3.style.color = "black";
 +
      }
 +
      bianse_3.onmouseout = function () {
 +
        bianse_3.style.color = "black";
 +
      }
 
     }
 
     }
 +
  }
 +
  guidong();
 
</script>
 
</script>
  
 
</html>
 
</html>

Revision as of 14:57, 27 October 2017

<!DOCTYPE html>
The replication process of E.coli replication can be devided into phase B,C and D, three phases. Phase B, also called pre-replication phase, is for DNA replication proparation similar as G1 phase in eukaryote cell cycle. Phase C is regarded as replication phase during which the chromosome is replicating corespond to the S phase in eukaryote. The last phase, phase D, is called post-replication phase, in which the behave of chromosome seperation and cell division happend just like what happened in G2 and M phase of eukaryote cells. the time of C phase and D phase in a generation is relative constant, so what actually determines the cell cycle is the initiation of genome replication. We know that cell have to garantee that each cell should have at least one chormosome, and this requires a highly coordination between DNA replication and cell divsion. Though the delicate mechanism of the corrdination is still a puzzle, it is clear that DnaA protein plays a significant role in this event. DnaA is a versatile protein, it can not only behave like a helicase opening the duble-helix of replication initiation site, OriC, while have the function of raising other proteins forming into the replisome to prolong the replication, but also can anchor the replicationg choromosome on the cell membrane leading the following seperation of chromosome. But what makes it the linker between replication and division is that its concentration determines the initiation volume of replication. So according to these information, we think that regulating the combination of DNA and DnaA protein will be an efficient method to regulate cell replication. For more information please click here.