Team:OUC-China
From 2014.igem.org
(Difference between revisions)
(90 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" /> | |
- | <link href="https://2014.igem.org/Team:OUC-China/css/topsection.css?action=raw&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 type="text/javascript" src="https://2014.igem.org/Team:OUC-China/js/jquery.devrama.slider.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> | |
- | # | + | <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: | + | height:615px; |
} | } | ||
- | # | + | #slider > ul { |
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
} | } | ||
- | # | + | #slider > ul > li { |
list-style: none; | list-style: none; | ||
} | } | ||
- | # | + | #slider > .dots { |
position: relative; | position: relative; | ||
left: 0; | left: 0; | ||
Line 26: | Line 379: | ||
margin: 0 !important; | margin: 0 !important; | ||
} | } | ||
- | # | + | #slider > .dots > li { |
display: inline-block; | display: inline-block; | ||
width: 10px; | width: 10px; | ||
Line 40: | Line 393: | ||
transition: background .5s, opacity .5s; | transition: background .5s, opacity .5s; | ||
} | } | ||
- | # | + | #slider > .dots > li.active { |
background: #5b97fb; | background: #5b97fb; | ||
opacity: 1; | opacity: 1; | ||
} | } | ||
- | + | @-webkit-keyframes CircleLogo { | |
- | + | 0% { | |
- | + | transform: rotate(0deg); | |
+ | } | ||
+ | 50% { | ||
+ | transform: rotate(180deg); | ||
+ | } | ||
+ | 100% { | ||
+ | transform: rotate(360deg); | ||
+ | } | ||
} | } | ||
- | + | @-moz-keyframes CircleLogo { | |
- | + | 0% { | |
- | + | transform: rotate(0deg); | |
+ | } | ||
+ | 50% { | ||
+ | transform: rotate(180deg); | ||
+ | } | ||
+ | 100% { | ||
+ | transform: rotate(360deg); | ||
+ | } | ||
} | } | ||
- | + | @-ms-keyframes CircleLogo { | |
- | + | 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); | |
- | + | } | |
- | + | ||
- | + | ||
} | } | ||
- | + | </style> | |
- | + | <script> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
if ($('.firstHeading')) $('.firstHeading').remove(); | if ($('.firstHeading')) $('.firstHeading').remove(); | ||
- | |||
- | |||
</script> | </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> | <ul> | ||
- | <li style=" | + | <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> | ||
- | + | <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> | |
- | TEAM | + | <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"> |
- | <div | + | <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' }); | ||
+ | } | ||
+ | resizeElement(); | ||
+ | window.onresize = resizeElement; | ||
+ | </script> | ||
+ | </div> | ||
+ | <div id="slider"> | ||
<ul> | <ul> | ||
<li> | <li> | ||
- | + | <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"> | |
- | + | ||
- | + | ||
- | + | ||
</li> | </li> | ||
<li> | <li> | ||
- | + | <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="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> | |
- | + | ||
- | + | ||
</li> | </li> | ||
<li> | <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> | </li> | ||
<li> | <li> | ||
- | + | <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> | ||
</ul> | </ul> | ||
</div> | </div> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
<script> | <script> | ||
- | $('# | + | $('#slider').unslider({ |
speed: 500, | speed: 500, | ||
delay: 3000, | delay: 3000, | ||
Line 304: | Line 527: | ||
}); | }); | ||
</script> | </script> | ||
- | <img src="https://static.igem.org/mediawiki/2014/9/ | + | <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> | ||
+ | <p>contact us: <a href="mailto:oucigem@163.com">oucigem@163.com</a></p> | ||
+ | </div> | ||
+ | <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.