Team:SYSU-Software/humanpra

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
*{list-style-type:none;}
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
-
/* zoombox */
+
<head>
-
.zoombox{width:970px;margin:20px auto 0 auto;}
+
<title>Team:SYSU-Software</title>
-
.zoompic{width:968px;height:500px;background:url(https://static.igem.org/mediawiki/2013/4/42/Loading.gif) no-repeat 50% 50%;text-align:center;}
+
-
.zoompic img{height: 500px;width:auto;margin:auto;}
+
-
.sliderbox{height:76px;overflow:hidden;margin:6px 0 0 0;}
+
-
.sliderbox .arrow-btn{z-index:1000;width:38px;height:76px;background:url(https://static.igem.org/mediawiki/2013/e/ed/Arrow-btn.png) no-repeat;cursor:pointer;}
+
-
.sliderbox #btn-left{float:left;background-position:0 0;}
+
-
.sliderbox #btn-left.dasabled{background-position:0 -76px;}
+
-
.sliderbox #btn-right{float:right;background-position:-38px 0;}
+
-
.sliderbox #btn-right.dasabled{background-position:-38px -76px;}
+
-
.sliderbox .slider{float:left;height:76px;width:870px;position:relative;overflow:hidden;margin:0 0 0 3px;display:inline;}
+
-
.sliderbox .slider ul{position:absolute;left:0;width:999em;}
+
-
.sliderbox .slider li{float:left;width:121px;height:76px;text-align:center;}
+
-
.sliderbox .slider li img{border:solid 1px #dfdfdf;}
+
-
.sliderbox .slider li.current img{border:solid 1px #3366cc;}
+
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
<meta http-equiv="Content-Style-Type" content="text/css" />
 +
<link href="https://raw.github.com/lovedayluk/iGEM2013/master/style.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" >
 +
<link href="https://2012.igem.org/Team:SYSU-Software/prefix.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" >
 +
<link href="https://2012.igem.org/Team:SYSU-Software/bootstrap.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
 +
<link href="https://2012.igem.org/Team:SYSU-Software/flatui.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
 +
<link href="https://2013.igem.org/Team:SYSU-Software/humanpra.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
 +
<!-- <link href="human practice/css/human practice.css" rel="stylesheet" type="text/css" /> -->
 +
<link href="https://2013.igem.org/Team:SYSU-Software/header.css?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css" />
-
*{
 
-
padding:0px;
 
-
margin: 0px;
 
-
}
 
-
body {
 
-
height: 100%;
 
-
width: 100%;
 
-
font-family: 'Arial';
 
-
}
 
-
/*human practice container*/
+
<script src="https://2013.igem.org/Team:SYSU-Software/jquery-1.9.1.min.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
-
#practice-container{
+
<script src="https://2013.igem.org/Team:SYSU-Software/bootstrap.min.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
-
width: 100%;
+
<script src="https://2013.igem.org/Team:SYSU-Software/prefix.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
-
margin: 0 auto;
+
<script src="https://2013.igem.org/Team:SYSU-Software/humanpra.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
-
}
+
<!-- <script src="human practice/humanpra.js" type="text/javascript"></script> -->
-
#practice-top-image{
+
-
width: 100%;
+
-
}
+
-
#practice-content{
+
-
background-color: white;
+
-
width:100%;
+
-
margin: auto;
+
-
}
+
-
#practice-content-image{
+
-
padding-top: 8px;
+
-
width: 980px;
+
-
margin: 0 auto;
+
-
}
+
-
#practice-content-image img{
+
-
width: 100%;
+
-
}
+
-
#practice-content-header{
+
-
padding-top: 40px;
+
-
width: 200px;
 
-
margin: 0 auto;
 
-
font-size: 35px;
 
-
color: #34495e;
 
-
font-weight: bolder;
 
-
}
 
-
#practice-introduction{
+
<style type="text/css">
-
padding-top: 40px;
+
</style>
-
width: 151px;
 
-
margin:0 auto;
 
-
font-size: 25px;
+
<script type="text/javascript">
-
color:#65d2c0;
+
</script>
-
font-weight: bolder;
+
-
}
+
-
#practice-introduction-text{
+
-
padding-top: 70px;
+
-
width: 800px;
+
-
margin:0 auto;
+
-
text-align: justify;
+
<head>
-
font-size: 18px;
+
<meta charset="utf-8">
-
line-height: 25px;
+
<title>new</title>
-
}
+
</head>
-
#practice-slide{
 
-
margin-top: 100px;
 
-
}
 
-
#practice-slide{ 
+
<body>
-
padding-bottom: 60px;
+
  <div id="navigation"></div>
-
width: 980px;
+
-
margin: 0 auto;
+
-
}
+
-
/*human practice content*/
+
-
#practice-game{
+
-
background-color: #dff5f2;
+
-
margin: auto;
+
-
width: 980px;
+
-
}
+
-
#game-header{
+
-
text-align: center;
+
-
padding-top: 50px;
+
-
font-size: 33px;
+
-
color: #34495e;
+
-
font-weight: bolder;
+
-
}
+
-
#game-show{
+
-
padding-top: 60px;
+
-
padding-bottom: 110px;
+
-
width: 968px;
+
-
margin: 0 auto;
+
-
}
+
-
#game-presentaion img{
+
-
width:500px;
+
-
}
+
-
#game-introdution{
+
-
margin-left: 30px;
+
-
width: 430px;
+
-
display: block;
+
-
text-align: justify;
+
-
font-size: 18px;
+
-
line-height: 25px;
+
-
}
+
-
  /*footer*/
+
-
#sysu-footer{
+
-
width: 100%;
+
-
margin:0 auto;
+
-
position: relative;
+
<div class="wrapper colored-wrapper-dff5f2">
-
bottom: 0px;
+
  <div id="practice-container">
-
overflow: hidden;
+
<!-- practice content -->
 +
    <div id="practice-top">
 +
      <!-- <img id="practice-top-image" src="https://static.igem.org/mediawiki/2013/b/b7/Human_practice_00.png"> -->
 +
<img class="medal" src="https://static.igem.org/mediawiki/2013/c/c8/Cast_Medal.png"/>
 +
      <img id="top_board" src="https://static.igem.org/mediawiki/2013/3/3f/Cast_human_practice_board.png">
 +
<img class="medal" src="https://static.igem.org/mediawiki/2013/c/c8/Cast_Medal.png"/>
 +
    </div>
-
background-color: #dff5f2;
+
    <div id="practice-content">
-
}
+
      <div id="practice-content-header">
-
#bottom-image{
+
        TEDx Salon
-
width: 100%;
+
      </div>
-
}
+
 +
      <div id="practice-content-image">
 +
        <img src="https://static.igem.org/mediawiki/2013/0/09/Human_practice_11.png">
 +
      </div>
 +
      <div id="practice-introduction">
 +
        Introduction
 +
      </div>
-
a:focus{
+
      <div id="practice-introduction-text">
-
outline-color:#544444;
+
        Accurate simulation and gene circuit design are essential but difficult parts in synthetic biology.Here, we designed CAST to cover the workflow from beginning to end, users can focus on function design and the gene circuit would be automatically designed. Furthermore, we developed a new simulation model that work with standard dynamic characteristic and verified by wetlab experiments. Moreover, we build an expandable database that users can contribute their own dynamic information which would lead to more accurate and sufficient dynamic information of all the Biobricks. Finally, our software is designed as an easy deployed server so that it can be used on personal purpose or shared by a whole lab or institution.
-
}
+
      </div>
-
.thumbnails {
+
      <div id="practice-slide">
-
cursor: pointer;
+
        <div class="zoombox">
-
}
+
          <div class="zoompic">
 +
            <img src="https://static.igem.org/mediawiki/2013/a/a2/Sysutedx_%283%29title.jpg" width="1000" height="400"  />
 +
          </div>
 +
 
 +
          <div class="sliderbox">
 +
            <div id="btn-left" class="arrow-btn dasabled"></div>
 +
              <div class="slider" id="thumbnail">
 +
                <ul>               
 +
                  <li class="current">
 +
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/6/6b/Sysutedx_%281%29.jpg">
 +
                      <img src="https://static.igem.org/mediawiki/2013/6/6b/Sysutedx_%281%29.jpg" width="115" height="74" />
 +
</span>
 +
                  </li>
-
#top_board.rotate {
+
                  <li>
-
transform-origin: 50% 0%;
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/4/48/Sysutedx_%282%29.jpg">
-
-webkit-transform-origin: 50% 0%;
+
                      <img src="https://static.igem.org/mediawiki/2013/4/48/Sysutedx_%282%29.jpg" width="115" height="74" />
-
-moz-transform-origin: 50% 0%;
+
</span>
-
-o-transform-origin: 50% 0%;
+
                  </li>
-
animation: myrotate 2s linear;
+
-
-webkit-animation: myrotate 2s linear;
+
-
-moz-animation: myrotate 2s linear;
+
-
-o-animation: myrotate 2s linear;
+
-
}
+
-
@keyframes myrotate {
+
                  <li>
-
0% {transform:rotate(0deg);}
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/a/a2/Sysutedx_%283%29title.jpg">
-
25% {transform:rotate(30deg);}
+
                      <img src="https://static.igem.org/mediawiki/2013/a/a2/Sysutedx_%283%29title.jpg" width="115" height="74" />
-
75% {transform:rotate(-20deg);}
+
</span>
-
100% {transform:rotate(0deg);}
+
                  </li>
-
}
+
-
@-webkit-keyframes myrotate {
+
                  <li>
-
0% {-webkit-transform:rotate(0deg);}
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/0/07/Sysutedx_%284%29.jpg">
-
25% {-webkit-transform:rotate(30deg);}
+
                      <img src="https://static.igem.org/mediawiki/2013/0/07/Sysutedx_%284%29.jpg" width="115" height="74" />
-
75% {-webkit-transform:rotate(-20deg);}
+
</span>
-
100% {-webkit-transform:rotate(0deg);}
+
                  </li>
-
}
+
-
@-moz-keyframes myrotate {
+
                  <li>
-
0% {-moz-transform:rotate(0deg);}
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/3/3d/Sysutedx_%285%29.jpg">
-
25% {-moz-transform:rotate(30deg);}
+
                      <img src="https://static.igem.org/mediawiki/2013/3/3d/Sysutedx_%285%29.jpg" width="115" height="74" />
-
75% {-moz-transform:rotate(-20deg);}
+
</span>
-
100% {-moz-transform:rotate(0deg);}
+
                  </li>
-
}
+
-
@-o-keyframes myrotate {
+
                  <li>
-
0% {-o-transform:rotate(0deg);}
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/7/77/Sysutedx_%286%29.jpg">
-
25% {-o-transform:rotate(30deg);}
+
                      <img src="https://static.igem.org/mediawiki/2013/7/77/Sysutedx_%286%29.jpg" width="115" height="74" />
-
75% {-o-transform:rotate(-20deg);}
+
</span>
-
100% {-o-transform:rotate(0deg);}
+
                  </li>
-
}
+
-
#practice-top .medal {
+
-
width: 80px;
+
-
vertical-align: top;
+
-
}
+
-
#practice-top {
+
-
text-align: center;
+
-
vertical-align: top;
+
-
border-top: solid 8px #6f3802;
+
-
margin-top: 100px;
+
-
width: 100%;
+
-
padding-bottom: 15px;
+
-
}
+
-
#top_board {
+
-
padding: 0 50px;
+
-
}
+
-
.zoompic img {
+
                  <li>
-
/* transition: all 0.3s; */
+
<span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/5/53/Sysutedx_%287%29.jpg">
-
/* -webkit-transition: all 0.3s; */
+
                      <img src="https://static.igem.org/mediawiki/2013/5/53/Sysutedx_%287%29.jpg" width="115" height="74" />
-
/* -moz-transition: all 0.3s; */
+
</span>
-
/* -o-transition: all 0.3s; */
+
                  </li>
-
}
+
 
 +
                  <li>
 +
                  <span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/7/72/Sysutedx_%288%29.jpg">
 +
                      <img src="https://static.igem.org/mediawiki/2013/7/72/Sysutedx_%288%29.jpg" width="115" height="74" />
 +
</span>
 +
                  </li>
 +
 
 +
                  <li>
 +
                   
 +
      <span class="thumbnails" data-path="https://static.igem.org/mediawiki/2013/a/a5/Sysutedx_%289%29.jpg">
 +
                      <img src="https://static.igem.org/mediawiki/2013/a/a5/Sysutedx_%289%29.jpg" width="115" height="74" />
 +
</span>
 +
                  </li>
 +
                </ul>
 +
              </div>
 +
            <div id="btn-right" class="arrow-btn"></div>
 +
          </div>
 +
 
 +
        </div><!--slider end-->
 +
      </div>
 +
 
 +
    </div>
 +
 
 +
    <div id="practice-game">
 +
      <div id="game-header">
 +
        Game
 +
      </div>
 +
      <div>
 +
        <div id="game-show">
 +
          <table>
 +
            <tr>
 +
              <td>
 +
                <a href="">
 +
                  <span id="game-presentaion">
 +
                    <img src="https://static.igem.org/mediawiki/2013/5/51/Wikiad.png.png">
 +
                  </span>
 +
                </a>
 +
              </td>
 +
 
 +
              <td>
 +
                <span id="game-introdution">
 +
                  Accurate simulation and gene circuit design are essential but difficult parts in synthetic biology.Here, we designed CAST to cover the workflow from beginning to end, users can focus on function design and the gene circuit would be automatically designed. Furthermore, we developed a new simulation model that work with standard dynamic characteristic and verified by wetlab experiments. Moreover, we build an expandable database that users can contribute their own dynamic information which would lead to more accurate and sufficient dynamic information of all the Biobricks. Finally, our software is designed as an easy deployed server so that it can be used on personal purpose or shared by a whole lab or institution.
 +
                </span>
 +
            </td>
 +
            </tr>
 +
          </table>
 +
        </div>
 +
      </div>
 +
    </div>
 +
  </div>
 +
</div>
 +
<!--page footer-->
 +
  <div id="sysu-footer"> 
 +
    <img id="bottom-image" src="https://static.igem.org/mediawiki/2013/d/d9/Sysu-footer.png">
 +
  </div>
 +
 
 +
</body>
 +
</html>

Revision as of 06:25, 27 September 2013

Team:SYSU-Software new

TEDx Salon
Introduction
Accurate simulation and gene circuit design are essential but difficult parts in synthetic biology.Here, we designed CAST to cover the workflow from beginning to end, users can focus on function design and the gene circuit would be automatically designed. Furthermore, we developed a new simulation model that work with standard dynamic characteristic and verified by wetlab experiments. Moreover, we build an expandable database that users can contribute their own dynamic information which would lead to more accurate and sufficient dynamic information of all the Biobricks. Finally, our software is designed as an easy deployed server so that it can be used on personal purpose or shared by a whole lab or institution.
Game
Accurate simulation and gene circuit design are essential but difficult parts in synthetic biology.Here, we designed CAST to cover the workflow from beginning to end, users can focus on function design and the gene circuit would be automatically designed. Furthermore, we developed a new simulation model that work with standard dynamic characteristic and verified by wetlab experiments. Moreover, we build an expandable database that users can contribute their own dynamic information which would lead to more accurate and sufficient dynamic information of all the Biobricks. Finally, our software is designed as an easy deployed server so that it can be used on personal purpose or shared by a whole lab or institution.

Retrieved from "http://2013.igem.org/Team:SYSU-Software/humanpra"