Team:OUC-China

From 2014.igem.org

(Difference between revisions)
 
(120 intermediate revisions not shown)
Line 1: Line 1:
{{CSS/Main}}
{{CSS/Main}}
<html>
<html>
-
    <link href="https://2014.igem.org/Team:OUC-China/css/bootstrap.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
+
<link href="https://2014.igem.org/Team:OUC-China/css/bootstrap.css?action=raw&amp;ctype=text/css" rel="stylesheet" />
 +
    <link href="https://2014.igem.org/Team:OUC-China/css/topsection.css?action=raw&ctype=text/css" rel="stylesheet" />
     <script src="https://2014.igem.org/Team:OUC-China/js/jquery.js?action=raw&ctype=text/javascript"></script>
     <script src="https://2014.igem.org/Team:OUC-China/js/jquery.js?action=raw&ctype=text/javascript"></script>
     <script src="https://2014.igem.org/Team:OUC-China/js/bootstrap.js?action=raw&ctype=text/javascript"></script>
     <script src="https://2014.igem.org/Team:OUC-China/js/bootstrap.js?action=raw&ctype=text/javascript"></script>
-
    <script src="https://2014.igem.org/Team:OUC-China/js/unslider.js?action=raw&ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2014.igem.org/Team:OUC-China/js/jquery.devrama.slider.js?action=raw&ctype=text/javascript"></script>
-
<style>
+
<script src="https://2014.igem.org/Team:OUC-China/js/unslider.js?action=raw&ctype=text/javascript"></script>
-
         #silder,#silder > ul, #silder > ul > li {
+
<style type="text/css">
 +
a:hover { text-decoration: none !important; }
 +
@charset "utf-8";
 +
/* CSS Document */
 +
body, div, p, ul, li, h1, h2, h3, h4, h5, h6 {
 +
margin: 0px;
 +
padding: 0px;
 +
font-family: "微软雅黑";
 +
}
 +
body{
 +
    min-width:1340px;
 +
}
 +
ul, ol {
 +
list-style: none;
 +
}
 +
img {
 +
display: block;
 +
position: absolute;
 +
}
 +
a {
 +
color: inherit;
 +
text-decoration: none;
 +
}
 +
@charset "utf-8";
 +
/* CSS Document */
 +
@keyframes bubleM {
 +
0% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
25% {
 +
margin-top:3px;
 +
margin-left:3px;
 +
}
 +
50% {
 +
margin-top:6px;
 +
margin-left:0px;
 +
}
 +
75% {
 +
margin-top:3px;
 +
margin-left:-3px;
 +
}
 +
100% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
}
 +
@-webkit-keyframes bubleM {
 +
0% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
25% {
 +
margin-top:3px;
 +
margin-left:3px;
 +
}
 +
50% {
 +
margin-top:6px;
 +
margin-left:0px;
 +
}
 +
75% {
 +
margin-top:3px;
 +
margin-left:-3px;
 +
}
 +
100% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
}
 +
.header {
 +
width: 1200px;
 +
height: 50px;
 +
margin: 0 auto;
 +
position: relative;
 +
}
 +
.header .igemLogo {
 +
transition: 0.5s;
 +
-moz-transition: 0.5s;
 +
-o-transition: 0.5s;
 +
-webkit-transition: 0.5s;
 +
}
 +
.header .igemLogo:hover {
 +
transform: rotate(360deg);
 +
-webkit-transform: rotate(360deg);
 +
-moz-transform: rotate(360deg);
 +
-o-transform: rotate(360deg);
 +
-ms-transform: rotate(360deg);
 +
}
 +
 
 +
.header .nav{
 +
top: 10px;
 +
left: 450px;
 +
}
 +
.header .Logo {
 +
width: 70px;
 +
height: 70px;
 +
background: url(https://static.igem.org/mediawiki/2014/f/fa/OUC-China_14Logo.png);
 +
position: absolute;
 +
right: 0;
 +
bottom: -10px;
 +
}
 +
.header .Logo ul {
 +
position: absolute;
 +
width: 250px;
 +
height: 150px;
 +
display: none;
 +
right: 0px;
 +
top: 70px;
 +
}
 +
.header .Logo li {
 +
height: 50px;
 +
width: 215px;
 +
line-height: 50px;
 +
font-size: 14px;
 +
background: #fff;
 +
margin: 10px 0 20px 0;
 +
position: relative;
 +
border-bottom-left-radius: 6px;
 +
border-top-left-radius: 6px;
 +
}
 +
.header .Logo li a {
 +
margin-left: 5px;
 +
}
 +
.header .Logo li img {
 +
position: absolute;
 +
right: -35px;
 +
top: -10px;
 +
}
 +
.neck {
 +
height: 512px;
 +
width: 100%;
 +
background: rgb(76,145,190);
 +
}
 +
.main {
 +
}
 +
.main .part1 {
 +
height: 480px;
 +
width: 100%;
 +
background: rgb(210,233,253);
 +
position: relative;
 +
}
 +
.main .part1 .waveUp {
 +
width: 100%;
 +
height: 130px;
 +
background: url(https://static.igem.org/mediawiki/2014/f/f0/WaveUp.png
 +
);
 +
position: absolute;
 +
bottom: 0;
 +
z-index: 0
 +
}
 +
.main .part1 .waveDown {
 +
width: 100%;
 +
height: 130px;
 +
background: url(https://static.igem.org/mediawiki/2014/6/63/WaveDown.png);
 +
position: absolute;
 +
bottom: 0;
 +
z-index: 3;
 +
}
 +
.main .part1 img {
 +
bottom: 60px;
 +
transition: 0.3s;
 +
-moz-transition: 0.3s;
 +
-o-transition: 0.3s;
 +
-webkit-transition: 0.3s;
 +
}
 +
.main .part1 img:hover {
 +
bottom: 80px;
 +
}
 +
.main .part1 .objLeft {
 +
left: 200px;
 +
}
 +
.main .part1 .objRight {
 +
right: 200px;
 +
}
 +
.main .part2 {
 +
width: 100%;
 +
height: 905px;
 +
background: rgb(96,159,210);
 +
position: relative;
 +
}
 +
.main .part2 ul li {
 +
position: absolute;
 +
display:none;
 +
}
 +
.main .part2 ul li p{
 +
display: block;
 +
position: absolute;
 +
width: 184px;
 +
color: rgb(49,129,194);
 +
text-align: center;
 +
font-size:24px;
 +
}
 +
.main .part2 .buble {
 +
animation-name: bubleM;
 +
animation-duration:1s;
 +
animation-timing-function: linear;
 +
animation-iteration-count: 10;
 +
animation-direction: alternate;
 +
animation-fill-mode: both;
 +
animation-play-state: running;
 +
-webkit-animation-name: bubleM;
 +
-webkit-animation-duration: 0.3s;
 +
-webkit-animation-timing-function: linear;
 +
-webkit-animation-iteration-count: 7;
 +
-webkit-animation-direction: alternate;
 +
-webkit-animation-fill-mode: both;
 +
-webkit-animation-play-state: running;
 +
}
 +
.delay1 {
 +
-moz-animation-delay: 0s;
 +
}
 +
.delay2 {
 +
-moz-animation-delay: 0.4s;
 +
}
 +
.delay3 {
 +
-moz-animation-delay: 0.8s;
 +
}
 +
.delay4 {
 +
-moz-animation-delay: 1.2s;
 +
}
 +
.delay5 {
 +
-moz-animation-delay: 1.6s;
 +
}
 +
.delay6 {
 +
-moz-animation-delay: 2s;
 +
}
 +
.main .part2 .lFish {
 +
left: 45px;
 +
bottom: -95px;
 +
}
 +
.main .part2 .rFish {
 +
right: 45px;
 +
bottom: -100px;
 +
}
 +
.footer {
 +
width: 100%;
 +
height: 220px;
 +
background: rgb(45,111,165);
 +
}
 +
@charset "utf-8";
 +
/* CSS Document */
 +
.nav {
 +
position: absolute;
 +
}
 +
.nav li {
 +
padding: 0 8px;
 +
float: left;
 +
position: relative;
 +
min-width: 80px;
 +
height: 40px;
 +
color: rgb(60,60,60);
 +
font-size: 24px;
 +
line-height: 40px;
 +
text-align: center;
 +
transition: 0.3s;
 +
-moz-transition: 0.3s;
 +
-o-transition: 0.3s;
 +
-webkit-transition: 0.3s;
 +
}
 +
.nav li:hover {
 +
background: rgb(146,205,253);
 +
color: #fff;
 +
}
 +
.nav .pMenu ul {
 +
display: none;
 +
position: absolute;
 +
top: 100%;
 +
left: 0px;
 +
overflow: hidden;
 +
border-bottom-left-radius: 6px;
 +
border-bottom-right-radius: 6px;
 +
}
 +
.nav .pMenu ul li {
 +
min-width: 220px;
 +
background: rgb(146,205,253);
 +
color: #fff;
 +
transition: 0.4s;
 +
-moz-transition: 0.4s;
 +
-o-transition: 0.4s;
 +
-webkit-transition: 0.4s;
 +
}
 +
.nav .pMenu ul li:hover {
 +
background: rgb(98,175,243);
 +
}
 +
.neck{ background-image:url(https://static.igem.org/mediawiki/2014/2/20/OUC-China_Index_Slide1.png)}
 +
.example-animation {
 +
color: #FFF;
 +
font-size: 60px;
 +
}
 +
header {
 +
            position: absolute;
 +
            width: 1020px;
 +
            margin: 0 auto;
 +
            z-index: 999;
 +
        }
 +
        header > ul {
 +
            list-style: none;
 +
            display: inline-block;
 +
            margin-left: 10px;
 +
            margin-right: 10px;float:left;
 +
            -webkit-transition: all ease 0.5s;
 +
        }
 +
        header > ul:hover {
 +
            margin-top: 0 !important;
 +
        }
 +
        header > ul > li {
 +
            width: 150px;
 +
            min-height: 50px;
 +
            padding: 10px;
 +
            background-color: #ffffff;
 +
        }
 +
        header > ul > li > a {
 +
            display: block;
 +
            font-size: 16px;
 +
            text-align: center;
 +
            cursor: pointer;
 +
            color: #1d89f7;
 +
        }
 +
        header > ul > li > a:hover {
 +
            color: #000000;
 +
            text-decoration: none;
 +
        }
 +
        header > ul > li:last-child {
 +
            height: 70px;
 +
            width: 70px;
 +
            border-radius: 50%;
 +
            margin-left: 40px;
 +
            margin-top: -10px;
 +
        }
 +
        header > ul > li:last-child > div {
 +
            width: 50px;
 +
            height: 50px;
 +
            border: 5px solid #1d89f7;
 +
            border-radius: 50%;
 +
        }
 +
        header > ul > li:last-child > div > div {
 +
            width: 0;
 +
            height: 0;
 +
            margin-left: 5px;
 +
            margin-top: 5px;
 +
            border-radius: 50%;
 +
            border: 15px solid #1d89f7;
 +
        }
 +
        .logo {
 +
            position: absolute;
 +
            top: 10px;
 +
            z-index: 10;
 +
        }
 +
#slider {
 +
            background-image: url(https://static.igem.org/mediawiki/2014/2/20/OUC-China_Index_Slide1.png);
 +
            background-repeat: no-repeat;
 +
            background-size: cover;
 +
        }
 +
         #slider,#slider > ul, #slider > ul > li {
             width:100%;
             width:100%;
-
             height:400px;
+
             height:615px;
         }
         }
-
         #silder > ul {
+
         #slider > ul {
             margin: 0;
             margin: 0;
             padding: 0;
             padding: 0;
         }
         }
-
         #silder > ul > li {
+
         #slider > ul > li {
             list-style: none;
             list-style: none;
         }
         }
-
             #silder > .dots {
+
             #slider > .dots {
                 position: relative;
                 position: relative;
                 left: 0;
                 left: 0;
Line 23: Line 377:
                 text-align: center;
                 text-align: center;
                 padding: 0;
                 padding: 0;
 +
                margin: 0 !important;
             }
             }
-
                 #silder > .dots > li {
+
                 #slider > .dots > li {
                     display: inline-block;
                     display: inline-block;
                     width: 10px;
                     width: 10px;
Line 38: Line 393:
                     transition: background .5s, opacity .5s;
                     transition: background .5s, opacity .5s;
                 }
                 }
-
                 #silder > .dots > li.active {
+
                 #slider > .dots > li.active {
                     background: #5b97fb;
                     background: #5b97fb;
                     opacity: 1;
                     opacity: 1;
                 }
                 }
-
         footer {
+
         @-webkit-keyframes CircleLogo {
-
             width: 100%;
+
             0% {
-
            height: 100px;
+
                transform: rotate(0deg);
-
             background-color: #4ca5fa;
+
             }
-
             margin-top: 50px;
+
            50% {
 +
                transform: rotate(180deg);
 +
             }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
         }
         }
-
         footer p {
+
         @-moz-keyframes CircleLogo {
-
             color: #ffffff;
+
             0% {
-
             font-size: 14px;text-align: right;
+
                transform: rotate(0deg);
-
             padding-right: 20px;
+
             }
 +
            50% {
 +
                transform: rotate(180deg);
 +
             }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
         }
         }
-
         footer p a {
+
         @-ms-keyframes CircleLogo {
-
             color: #ffffff;
+
             0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
         }
         }
-
         footer p a:hover {
+
         @keyframes CircleLogo {
-
             color: #c7f1ff;
+
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
             }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
         }
         }
-
</style>
+
</style>
-
    <div style="width:1024px;height:256px;background-image:url([[Media:OUC-China_index_banner.png]]);margin: 0 auto"></div>
+
<script>
-
    <div style="background-color:#4ca5fa">
+
        if ($('.firstHeading')) $('.firstHeading').remove();
-
        <div class="navbar navbar-inverse" style="margin:0 auto;width:895px">
+
    </script>
-
            <div class="navbar-collapse collapse navbar-inverse-collapse">
+
<a href="https://igem.org/Main_Page"><img class="logo" src="https://static.igem.org/mediawiki/2014/c/c6/OUC-China_Content_IGEM.png" style="left:10px" /></a>
-
                <ul class="nav navbar-nav">
+
<img class="logo" style="right:10px;animation: CircleLogo 20s linear infinite;-webkit-animation: CircleLogo 20s linear infinite;-moz-animation: CircleLogo 20s linear infinite;-ms-animation: CircleLogo 20s linear infinite" src="https://static.igem.org/mediawiki/2014/0/00/OUC_China_Content_Team.png" />
-
                    <li class="active"><a href="#"><span class="glyphicon glyphicon-home"></span>&nbsp;&nbsp;HOME</a></li>
+
    <header>
-
                    <li class="dropdown">
+
        <ul>
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-user"></span>&nbsp;&nbsp;TEAM <b class="caret"></b></a>
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a href="#" style="font-size:22px">HOME</a></li>
-
                        <ul class="dropdown-menu">
+
            <li><div><div></div></div></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team">Member</a></li>
+
        </ul>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Attribution">Attribution</a></li>
+
        <ul style="margin-top:-260px">
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Gallery">Gallery</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Team">Members</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgement">Acknowledgement</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Instructor">Instructor</a></li>
-
                        </ul>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgment">Acknowledgment</a></li>
-
                    </li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Lab">Lab</a></li>
-
                    <li class="dropdown">
+
            <li><a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China">Official Team Profile</a></li>
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-edit"></span>&nbsp;&nbsp;PROJECT <b class="caret"></b></a>
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style ="font-size:22px">TEAM</a></li>
-
                        <ul class="dropdown-menu">
+
            <li><div><div></div></div></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project">Overview</a></li>
+
        </ul>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Background">Background</a></li>
+
        <ul style="margin-top:-325px">
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Design">Design</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project">Overview</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Result">Result</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Background">Background</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Projec_Future workt">Future work</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Design">Design</a></li>
-
                        </ul>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Result">Result</a></li>
-
                    </li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Future">Future</a></li>
-
                    <li class="dropdown">
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></li>
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-cog"></span>&nbsp;&nbsp;MODELING <b class="caret"></b></a>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Policy_Practise">Policy&Practice</a></li>
-
                        <ul class="dropdown-menu">
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">PROJECT</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling">Overview</a></li>
+
            <li><div><div></div></div></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_Why">Why</a></li>
+
        </ul>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_Aim">Aim</a></li>
+
        <ul style="margin-top:-90px">
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_??">??</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Biobrick</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_Model">Model</a></li>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achievment">Achievement</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_DataAnalyse">Data &amp; Analyse</a></li>
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">JUDGING</a></li>
-
                        </ul>
+
            <li><div><div></div></div></li>
-
                    </li>
+
        </ul>
-
                    <li class="dropdown">
+
        <ul style="margin-top:-100px">
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-stats"></span>&nbsp;&nbsp;JUDGING <b class="caret"></b></a>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety">Biosafety</a></li>
-
                        <ul class="dropdown-menu">
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Lab_safety">Labsafety</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Part</a></li>
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">SAFETY</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achieveent">Achieveent</a></li>
+
            <li><div><div></div></div></li>
-
                        </ul>
+
        </ul>
-
                    </li>
+
        <ul style="margin-top:-145px">
-
                    <li class="dropdown">
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Lab Note</a></li>
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-warning-sign"></span>&nbsp;&nbsp;SAFETY <b class="caret"></b></a>
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Modeling_Note">Modeling Note</a></li>
-
                        <ul class="dropdown-menu">
+
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Protocols">Protocols</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety">Overview</a></li>
+
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">NOTEBOOK</a></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_DoubleSystemSafety">Double system safety</a></li>
+
            <li><div><div></div></div></li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_LysisSafety">Lysis safety</a></li>
+
        </ul>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Transfection">Transfection</a></li>
+
    </header>
-
                        </ul>
+
    <script>
-
                    </li>
+
        var header = $('header');
-
                    <li class="dropdown">
+
        function resizeElement() {
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-comment"></span>&nbsp;&nbsp;HUMAN PRACTICE <b class="caret"></b></a>
+
            header.css({ marginLeft: (window.innerWidth - 1020) / 2 + 'px' });
-
                        <ul class="dropdown-menu">
+
        }
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/HumanPractice">???</a></li>
+
        resizeElement();
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/HumanPractice_???">???</a></li>
+
        window.onresize = resizeElement;
-
                        </ul>
+
    </script>
-
                    </li>
+
</div>
-
                </ul>
+
<div id="slider">
-
            </div>
+
         <ul>
-
        </div>
+
             <li>
-
    </div>  
+
                 <img src="https://static.igem.org/mediawiki/2014/4/42/OUC-China_Index_Slide2.png" style="width: 80%;margin:80px auto;display:block;position:inherit">
-
    <div style="margin:0 auto;width:1024px">
+
             </li>
-
        <!--Slide area-->
+
             <li>
-
        <div style="padding:20px 10px 20px 10px">
+
<img src="https://static.igem.org/mediawiki/2014/5/5a/OUC-China_Index_Slide3.png" style="width:80%;position:inherit;margin:80px auto;display:block;" />
-
            <div style="border: 2px solid #5b97fb">
+
<div style="width:5px;height:100%;position:relative;background-color:#ffffff;margin-left:49%;transform: rotate(10deg);-webkit-transform: rotate(10deg);-moz-transform: rotate(10deg);-ms-transform: rotate(10deg);margin-top:-600px;"></div>
-
                <div id="silder">
+
             </li>
-
                    <ul>
+
            <li>
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
<img src="https://static.igem.org/mediawiki/2014/5/58/OUC-China_Index_Slide4.png" style="width:80%;margin:80px auto;display:block;position:inherit" />
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
             </li>
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
            <li>
-
                    </ul>
+
<img src="https://static.igem.org/mediawiki/2014/2/2f/OUC-China_Index_Slide5.png" style="width:80%;margin:80px auto;display:block;position:inherit" />
-
                </div>
+
             </li>
-
                <script>
+
         </ul>
-
                    $('#silder').unslider({
+
-
                        speed: 500,
+
-
                        delay: 3000,
+
-
                        keys: true,
+
-
                        dots: true,
+
-
                        fluid: false
+
-
                    });
+
-
                </script>
+
-
            </div>
+
-
        </div>
+
-
         <!--Mini-part area-->
+
-
        <div class="col-md-4">
+
-
             <div class="panel panel-primary">
+
-
                 <div class="panel-heading">
+
-
                    <h3 class="panel-title">Coming soon...</h3>
+
-
                </div>
+
-
                <div class="panel-body">
+
-
                    This is the first content.
+
-
                </div>
+
-
             </div>
+
-
        </div>
+
-
        <div class="col-md-4">
+
-
             <div class="panel panel-primary">
+
-
                <div class="panel-heading">
+
-
                    <h3 class="panel-title">Coming soon...</h3>
+
-
                </div>
+
-
                <div class="panel-body">
+
-
                    This is the second content.
+
-
                </div>
+
-
             </div>
+
-
        </div>
+
-
        <div class="col-md-4">
+
-
             <div class="panel panel-primary">
+
-
                <div class="panel-heading">
+
-
                    <h3 class="panel-title">Coming soon...</h3>
+
-
                </div>
+
-
                <div class="panel-body">
+
-
                    This is the last content.
+
-
                </div>
+
-
             </div>
+
-
         </div>
+
     </div>
     </div>
 +
    <script>
 +
    $('#slider').unslider({
 +
        speed: 500,
 +
        delay: 3000,
 +
        keys: true,
 +
        dots: true,
 +
        fluid: false
 +
    });
 +
    </script>
 +
<div class = "main">
 +
  <div class = "part1">
 +
<h2 class="text-primary" style="width: 960px;margin:0 auto;padding-top:10px;">Introduction</h2>
 +
<p style="width: 960px;margin:0 auto;font-size: 19px;padding-top:12px;">Current researches usually transfer exogenous DNA into prokaryotic cells and eukaryotic cells, while OUC-China iGEM team has designed an innovative method to carry exogenous DNA from prokaryote to eukaryota more efficiently. Eventually we have applied the method to studies of the model organism, zebrafish. <br />
 +
We have constructed the fusion protein that can bind and protect plasmids, with the ability of helping plasmids transfect into eukaryotic cells in high efficiency.</p>
 +
<a href="https://2014.igem.org/Team:OUC-China/Project" class="btn btn-primary btn-lg" style="display:block;margin:40px auto;width:200px;position:relative;color: #ffffff;">Learn More</a>
 +
    <div class = "waveUp"></div>
 +
    <div class = "waveDown"></div>
 +
    <img class = "objLeft" src="https://static.igem.org/mediawiki/2014/4/41/OUC-China_Index_Plasmid1.png"/> <img class = "objRight" src="https://static.igem.org/mediawiki/2014/e/e6/OUC-China_Index_Plasmid2.png"/> </div>
 +
  <div class = "part2"> <img class = "lFish" src="https://static.igem.org/mediawiki/2014/a/a0/OUC-China_FishLeft.png"/> <img class = "rFish" src="https://static.igem.org/mediawiki/2014/d/de/OUC-China_FishRight.png"/>
 +
    <ul style="width:1350px; margin:auto; position:relative;">
 +
      <li style = "top:85px;left:145px;-webkit-animation-duration: 0.3s;"> <img src="https://static.igem.org/mediawiki/2014/4/45/OUC-China_1.png"/> <img id = "lGear" src="https://static.igem.org/mediawiki/2014/d/d0/LGear.png" style="top:59px;left:131px;display:none;"/> <img src="https://static.igem.org/mediawiki/2014/f/f5/OUC-China_BGear.png" style="top:75px;left:25px;"/>
 +
        <p style="top: 200px; left: 70px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Design#Double_Plamisd">The Double Plasmid System</a></p>
 +
      </li>
 +
      <li style = "top:30px;left:520px;-webkit-animation-duration: 0.33s;"><img src="https://static.igem.org/mediawiki/2014/6/61/OUC-China2.png"/> <img src="https://static.igem.org/mediawiki/2014/9/91/OUC-China_Circle.png" style="top: 69px; left: 38px;"> <img id = "lGear2" src="https://static.igem.org/mediawiki/2014/d/d0/LGear.png" style="top: 34px; left: 179px;">
 +
        <p style="top: 275px; left: 86px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Design#Transfection">Transfection</a></p>
 +
      </li>
 +
      <li style = "top:80px;left:930px;-webkit-animation-duration: 0.35s;"><img src="https://static.igem.org/mediawiki/2014/9/93/OUC-China_3.png"/> <img id = "express" src="https://static.igem.org/mediawiki/2014/b/b6/OUC-China_Expression.png" style="top: 201px; left: 88px;display:none;"> <img src="https://static.igem.org/mediawiki/2014/5/52/OUC-China_Model.png" style="top: 42px; left: 79px;">
 +
        <p style="top: 246px; left: 67px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></p>
 +
      </li>
 +
      <li style = "top:450px;left:190px; -webkit-animation-duration: 0.18s;-webkit-animation-iteration-count: 10;"><img src="https://static.igem.org/mediawiki/2014/5/50/OUC-China_4.png"/> <img id = "peiYang" src="https://static.igem.org/mediawiki/2014/c/c5/PeiYang.png" style="top: 55px; left:80px;">
 +
        <p style="top: 232px; left: 59px;"><a href="https://2014.igem.org/Team:OUC-China/Judging">Judging</a></p>
 +
      </li>
 +
      <li style = "top:414px;left:530px;-webkit-animation-duration: 0.37s;"><img src="https://static.igem.org/mediawiki/2014/e/e2/OUC-China_5.png"/> <img id = "safety" src="https://static.igem.org/mediawiki/2014/3/3b/OUC-China_Blue.png" style="top: 97px; left: 92px;">
 +
        <p style="top: 267px; left: 74px;"><a href="https://2014.igem.org/Team:OUC-China/Safety">Safety</a></p>
 +
      </li>
 +
      <li style = "top:450px;left:920px; -webkit-animation-duration: 0.18s;-webkit-animation-iteration-count: 10;"><img src="https://static.igem.org/mediawiki/2014/8/8a/OUC-China_6.png"/> <img id = "lamp" src="https://static.igem.org/mediawiki/2014/8/80/OUC-China_lamp.png" style="top: 53px; left: 85px;">
 +
        <p style="top: 231px; left: 69px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Policy_Practise">Policy&Practise </a></p>
 +
      </li>
 +
    </ul>
 +
  </div>
 +
  <script>
 +
    var  list = $(".part2 ul>li");
 +
$(window).scroll(function(){
 +
  if($(document).scrollTop() >= 900){
 +
for(var i = 0;i < list.length;i++){
 +
  list.eq(i).delay(i * 8).fadeIn(800).addClass("buble delay"+(i + 1));
 +
}
 +
  };
 +
});
 +
$("#lGear").parent().hover(function(){
 +
  $("#lGear").fadeIn(1000);
 +
},function(){
 +
  $("#lGear").fadeOut(1000,function(){
 +
    $("#lGear").clearQueue();
 +
  });
 +
});
 +
$("#lGear2").parent().hover(function(){
 +
  $("#lGear2").animate({left:'83px',top:'115px'},1000);
 +
},function(){
 +
  $("#lGear2").animate({left:'179px',top:'34px'},800,function(){
 +
    $(this).clearQueue();
 +
  });
 +
});
 +
$("#express").parent().hover(function(){
 +
      $("#express").fadeIn(1000);
 +
},function(){
 +
  $("#express").fadeOut(1000,function(){
 +
    $("#express").clearQueue();
 +
  });
 +
});
 +
$("#peiYang").parent().hover(function(){
 +
  document.getElementById("peiYang").src = "https://static.igem.org/mediawiki/2014/1/13/OUC-China_Medal.png";
 +
  },function(){
 +
document.getElementById("peiYang").src = "https://static.igem.org/mediawiki/2014/c/c5/PeiYang.png";
 +
});
 +
$("#safety").parent().hover(function(){
 +
  document.getElementById("safety").src = "https://static.igem.org/mediawiki/2014/c/cc/OUC-China_Red.png";
 +
},function(){
 +
  document.getElementById("safety").src = "https://static.igem.org/mediawiki/2014/3/3b/OUC-China_Blue.png";
 +
});
 +
$("#lamp").parent().hover(function(){
 +
document.getElementById("lamp").src = "https://static.igem.org/mediawiki/2014/4/40/OUC-China_deng.png";
 +
},function(){
 +
document.getElementById("lamp").src = "https://static.igem.org/mediawiki/2014/8/80/OUC-China_lamp.png";
 +
});
 +
  </script>
 +
</div>
 +
<div class = "footer">
 +
  <style>
 +
    .footer > div { width: 418px; margin: 0 auto; padding-top: 50px; }
 +
    .footer > div > img { float: left; height: 100px; display: inline-block; position: relative; margin-left: 6px; margin-right: 6px; }
 +
    .footer > p { text-align: center; color: #ffffff }
 +
    .footer > p > a { color: #ffffff; }
 +
  </style>
 +
  <div>
 +
    <img src="https://static.igem.org/mediawiki/2014/a/ad/OUC-China_Index_OrgLogo.png" />
 +
    <img src="https://static.igem.org/mediawiki/2014/e/ec/OUC-China_Index_OrgTitle.jpg" />
 +
    <img src="https://static.igem.org/mediawiki/2014/9/96/OUC-China_Foot_ouclogo.png" />
     <div style="clear:both"></div>
     <div style="clear:both"></div>
-
    <footer>
+
  </div>
-
        <p style="padding-top:40px">Designed by WinUP Software</p>
+
  <p>contact us: <a href="mailto:oucigem@163.com">oucigem@163.com</a></p>
-
        <p>Thanks to <a href="http://getbootstrap.com/">Bootstrap</a>, <a href="http://bootswatch.com/">Bootswatch</a> and <a href="http://glyphicons.com/">Glyphicons</a></p>
+
</div>
-
    </footer>
+
<img class="anchor" onclick="document.documentElement.scrollTop = document.body.scrollTop = 0;" src="https://static.igem.org/mediawiki/2014/b/b6/ToTop.png"/>  
</html>
</html>
-
<!--
 
-
<html>
 
-
 
-
<!--main content -->
 
-
<table width="70%" align="center">
 
-
 
-
<tr> <td colspan="3"  height="15px"> </td></tr>
 
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
 
-
<tr> <td colspan="3"  height="5px"> </td></tr>
 
-
 
-
<tr><td colspan="3"> <h3> Plasmid transfer </h3></td></tr>
 
-
<tr><td colspan=3>
 
-
<p>We are working on building different kinds of plasmid transfer system. The Special plasmid that we constructed is transferred to the different cell by different ways. Here are two project for plasmid transfer.</p>
 
-
<p> For prokaryote:</p>
 
-
<p>Previous studies have shown that DNA transfer by bacterial conjugation requires a mating pair formation (Mpf) system that specifies functions for establishing the physical contact between the donor and the recipient cell and for DNA transport across membranes. During bacterial conjugation, the single-stranded DNA molecule is transferred through the cell envelopes of the donor and the recipient cell. For example the IncPa plasmid RP4, a thorough sequence analysis of the gene products of the transfer regions Tra1 and Tra2 revealed typical features of mainly inner membrane proteins, both of which contribute to Mpf.</p>
 
-
<p>Our project aims to construct a system of double plasmids, one is a mini plasmid carrying the oriT sequence and the other is a plasmid carrying the transfer regions of the broad-host-range IncP plasmid RP4, moreover, the two plasmids we construct are compatible. In the transfer system, the large one doesn’t carry oriT region while it carry the transfer regions tra and trb, due to lacking the sequence of oriT, the large plasmid can’t transfer between cells, thus the recipient strain don’t have the ability of conjugation. In the meantime, the other plasmid carrying oriT can transfer under the induction of the tra1 and tra2.</p>
 
-
<p>For eukaryote: </p>
 
-
<p>Fish diseases cause billion loss in the aquaculture filed every year. Traditional therapeutic method may do harm to the fishes and environment. However, using plasmid that contains the antigen genes as a new kind of vaccine can cause the immune reaction.</p>
 
-
<p>To achieve that goal, we will construct the recombinant pet32a (+) - TAT :: H4 plasmid, and transform into competent cells BL21 (DE3) in order to produce TAT :: H4, the products were purified and finally wewant to gain the fusion protein. Meanwhile for transfection of fish cells, we are going to construct carrying EGFP and CMV promoter plasmid pcDNA3.1 (+) - EGFP plasmid for detecting the expression and effect of transfection in eukaryotic cells.</p>
 
-
</td></tr>
 
-
 
-
<tr> <td colspan="3"  height="15px"> </td></tr>
 
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
 
-
<tr> <td colspan="3"  height="5px"> </td></tr>
 
-
 
-
 
-
<!--requirements section -->
 
-
<tr><td colspan="3"> <h3> Requirements </h3></td></tr>
 
-
<tr>
 
-
<td width="45%"  valign="top">
 
-
 
-
<p> Please be sure to keep these links, your audience will want to find your: </p>
 
-
 
-
<!-- Links to other team pages -->
 
-
<ul>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China">Home</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Team">Team</a> </li>
 
-
<li><a href="https://igem.org/Team.cgi?year=2013&team_name=OUC-China">Official Team Profile</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Project">Project</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Parts">Parts</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Modeling">Modeling</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Notebook</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Safety">Safety</a> </li>
 
-
<li><a href="https://2014.igem.org/Team:OUC-China/Attributions">Attributions</a> </li>
 
-
 
-
</ul>
 
-
 
-
</td>
 
-
 
-
<td > </td>
 
-
<td width="45%">
 
-
 
-
<p>There are a few wiki requirements teams must follow:</p>
 
-
<ul>
 
-
<li>All pages, images and files must be hosted on the <a href ="https://2014.igem.org/Special:Upload">  2014.igem.org server</a>. </li>
 
-
<li>All pages must be created under the team’s name space.</li>
 
-
<li>As part of your documentation, keep the links from the menu to the left. </li>
 
-
<li>Do not use flash in wiki code. </li>
 
-
<li>The <a href="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png"> iGEM logo </a> should be placed on the upper part of every page and should link to <a href="https://2014.igem.org/Main_Page">2014.igem.org</a>.</li>
 
-
</ul>
 
-
<p>Visit the <a href="https://2014.igem.org/Wiki_How-To"> Wiki How To page </a> for a complete list of requirements, tips and other useful information. </p>
 
-
 
-
</td>
 
-
</tr>
 
-
 
-
 
-
<tr> <td colspan="3"  height="15px"> </td></tr>
 
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1"> </tr>
 
-
 
-
 
-
<!--tips  -->
 
-
<tr><td colspan="3" > <h3> Tips  </h3></td></tr>
 
-
 
-
<tr>
 
-
<td width="45%" valign="top">
 
-
<p>We are currently working on providing teams with some easy to use design templates.
 
-
<br> In the meantime you can also view other team wikis for inspiration! Here are some very good examples</p>
 
-
 
-
<ul>
 
-
<li> <a href="https://2013.igem.org/Team:SDU-Denmark/"> 2013 SDU Denmark </a> </li>
 
-
<li> <a href="https://2013.igem.org/Team:SYSU-China">2013 SYSU China</a> </li>
 
-
<li> <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG"> 2013 Shenxhen BGIG ATCG </a></li>
 
-
<li> <a href="https://2013.igem.org/Team:Colombia_Uniandes">2013 Colombia Unianades </a></li>
 
-
<li> <a href="https://2013.igem.org/Team:Lethbridge">2013 Lethbridge</a></li>
 
-
</ul>
 
-
 
-
<p>For a full wiki list, you can visit <a href="https://igem.org/Team_Wikis?year=2013">iGEM 2013 web sites </a> and <a href="https://igem.org/Team_Wikis?year=2012">iGEM 2012 web sites</a>  lists. </p>
 
-
</td>
 
-
 
-
<td> </td>
 
-
<td width="45%">
 
-
 
-
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
 
-
 
-
<ul>
 
-
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
 
-
<li>Be clear about what you are doing and what you plan to do.</li>
 
-
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
 
-
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
 
-
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
 
-
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="">iGEM 2013 calendar</a> </li>
 
-
<li>Have lots of fun! </li>
 
-
</ul>
 
-
</br>
 
-
</td>
 
-
</tr>
 
-
</table>
 
-
-->
 

Latest revision as of 03:59, 18 October 2014

Introduction

Current researches usually transfer exogenous DNA into prokaryotic cells and eukaryotic cells, while OUC-China iGEM team has designed an innovative method to carry exogenous DNA from prokaryote to eukaryota more efficiently. Eventually we have applied the method to studies of the model organism, zebrafish.
We have constructed the fusion protein that can bind and protect plasmids, with the ability of helping plasmids transfect into eukaryotic cells in high efficiency.

Learn More

contact us: oucigem@163.com

Retrieved from "http://2014.igem.org/Team:OUC-China"