Team:OUC-China

From 2014.igem.org

(Difference between revisions)
 
(118 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);
 +
            }
 +
        }
 +
        @keyframes CircleLogo {
 +
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
         }
         }
-
         footer p a:hover {
+
</style>
-
             color: #c7f1ff;
+
<script>
 +
         if ($('.firstHeading')) $('.firstHeading').remove();
 +
    </script>
 +
<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>
 +
<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" />
 +
    <header>
 +
        <ul>
 +
             <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a href="#" style="font-size:22px">HOME</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-260px">
 +
            <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_Instructor">Instructor</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgment">Acknowledgment</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Lab">Lab</a></li>
 +
            <li><a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China">Official Team Profile</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style ="font-size:22px">TEAM</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-325px">
 +
            <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_Background">Background</a></li>
 +
            <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_Result">Result</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Future">Future</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Policy_Practise">Policy&Practice</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">PROJECT</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-90px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Biobrick</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achievment">Achievement</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">JUDGING</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-100px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety">Biosafety</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Lab_safety">Labsafety</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">SAFETY</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-145px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Lab Note</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Modeling_Note">Modeling Note</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Protocols">Protocols</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">NOTEBOOK</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
    </header>
 +
    <script>
 +
        var header = $('header');
 +
        function resizeElement() {
 +
            header.css({ marginLeft: (window.innerWidth - 1020) / 2 + 'px' });
         }
         }
-
</style>
+
         resizeElement();
-
         <script>
+
        window.onresize = resizeElement;
-
            if($('#firstHeading')) $('#firstHeading').remove();
+
    </script>
-
        </script>
+
</div>
-
    <div style="width:1024px;height:256px;background-image:url([[Media:OUC-China_index_banner.png]]);margin: 0 auto"></div>
+
<div id="slider">
-
    <div style="background-color:#4ca5fa">
+
         <ul>
-
         <div class="navbar navbar-inverse" style="margin:0 auto;width:895px">
+
             <li>
-
             <div class="navbar-collapse collapse navbar-inverse-collapse">
+
                 <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">
-
                 <ul class="nav navbar-nav">
+
            </li>
-
                    <li class="active"><a href="#"><span class="glyphicon glyphicon-home"></span>&nbsp;&nbsp;HOME</a></li>
+
            <li>
-
                    <li class="dropdown">
+
<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;" />
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-user"></span>&nbsp;&nbsp;TEAM <b class="caret"></b></a>
+
<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>
-
                        <ul class="dropdown-menu">
+
            </li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team">Member</a></li>
+
            <li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Attribution">Attribution</a></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><a href="https://2014.igem.org/Team:OUC-China/Team_Gallery">Gallery</a></li>
+
            </li>
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgement">Acknowledgement</a></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" />
-
                    </li>
+
             </li>
-
                    <li class="dropdown">
+
        </ul>
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-edit"></span>&nbsp;&nbsp;PROJECT <b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                            <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_Background">Background</a></li>
+
-
                            <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_Result">Result</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Projec_Future workt">Future work</a></li>
+
-
                        </ul>
+
-
                    </li>
+
-
                    <li class="dropdown">
+
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-cog"></span>&nbsp;&nbsp;MODELING <b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling">Overview</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_Why">Why</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_Aim">Aim</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Modeling_??">??</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/Modeling_DataAnalyse">Data &amp; Analyse</a></li>
+
-
                        </ul>
+
-
                    </li>
+
-
                    <li class="dropdown">
+
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-stats"></span>&nbsp;&nbsp;JUDGING <b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Part</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achieveent">Achieveent</a></li>
+
-
                        </ul>
+
-
                    </li>
+
-
                    <li class="dropdown">
+
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-warning-sign"></span>&nbsp;&nbsp;SAFETY <b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety">Overview</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_DoubleSystemSafety">Double system safety</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_LysisSafety">Lysis safety</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Transfection">Transfection</a></li>
+
-
                        </ul>
+
-
                    </li>
+
-
                    <li class="dropdown">
+
-
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-comment"></span>&nbsp;&nbsp;HUMAN PRACTICE <b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/HumanPractice">???</a></li>
+
-
                            <li><a href="https://2014.igem.org/Team:OUC-China/HumanPractice_???">???</a></li>
+
-
                        </ul>
+
-
                    </li>
+
-
                </ul>
+
-
            </div>
+
-
        </div>
+
-
    </div> 
+
-
    <div style="margin:0 auto;width:1024px">
+
-
        <!--Slide area-->
+
-
        <div style="padding:20px 10px 20px 10px">
+
-
             <div style="border: 2px solid #5b97fb">
+
-
                <div id="silder">
+
-
                    <ul>
+
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
-
                        <li><h1 style="margin:50px">Coming soon...</h1></li>
+
-
                    </ul>
+
-
                </div>
+
-
                <script>
+
-
                    $('#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>

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"