Difference between revisions of "Team:NUDT CHINA"

 
(154 intermediate revisions by the same user not shown)
Line 11: Line 11:
 
var oList = $('Qidilist');
 
var oList = $('Qidilist');
 
var aLiList = getByClass( oList , 'liList' );
 
var aLiList = getByClass( oList , 'liList' );
−
var aDivList = getByClass( oList , 'divList' );
 
−
var oHomeContent = $('homeContent');
 
−
var oHomeContent1 = getByClass(oHomeContent , 'homeContent1')[0];
 
−
var oHomeContent2 = getByClass(oHomeContent , 'homeContent2')[0];
 
 
var oMenu = $('lay-menu');
 
var oMenu = $('lay-menu');
 
   var oNextBtn=$('next-button');
 
   var oNextBtn=$('next-button');
 
var aLiMenu = oMenu.getElementsByTagName('li');
 
var aLiMenu = oMenu.getElementsByTagName('li');
−
var Btn1=$('button-after-1');
 
−
var Btn2=$('button-after-2');
 
−
var Btn3=$('button-after-3');
 
 
var iNow = 0;
 
var iNow = 0;
 
var prevIndex = 0;
 
var prevIndex = 0;
 
var iContentHeight = 0;
 
var iContentHeight = 0;
 +
var btn1 = $('btn1');
 +
var btn2 = $('btn2');
 +
var btn3 = $('btn3');
 +
var btn4 = $('btn4');
 
contentAuto();
 
contentAuto();
−
listContentAuto();
 
−
bindNav();
 
 
mouseWheel();
 
mouseWheel();
−
homeContent();
+
bindNav();
 
add1();
 
add1();
 
add2();
 
add2();
Line 38: Line 33:
 
}
 
}
 
function add2() {
 
function add2() {
−
Btn1.onclick=function () {
+
btn1.onclick=function () {
 
toMove(1);
 
toMove(1);
−
};
+
iNow=1;
−
Btn2.onclick=function () {
+
}
 +
btn2.onclick=function () {
 
toMove(2);
 
toMove(2);
−
};
+
iNow=2;
−
Btn3.onclick=function () {
+
−
toMove(0);
+
−
};
+
−
}
+
−
function showLoading(){
+
−
var oSpan = oLoading.getElementsByTagName('span')[0];
+
−
var aDiv = oLoading.getElementsByTagName('div');
+
−
oSpan.style.width = '100%';
+
−
oSpan.addEventListener('webkitTransitionend',spanChange,false);
+
−
oSpan.addEventListener('transitionend',spanChange,false);
+
−
function spanChange(){
+
−
if(oSpan.style.width == '100%'){
+
−
oSpan.style.display = 'none';
+
−
aDiv[0].style.height = 0;
+
−
aDiv[1].style.height = 0;
+
−
}
+
−
}
+
−
aDiv[0].addEventListener('webkitTransitionend',divChange,false);
+
−
aDiv[0].addEventListener('transitionend',divChange,false);
+
−
+
−
function divChange(){
+
−
oLoading.parentNode.removeChild(oLoading);
+
 
}
 
}
−
+
btn3.onclick=function () {
−
}
+
toMove(3);
−
 
+
iNow=3;
−
function bindNav(){
+
−
for(var i=0;i<aLiMenu.length;i++){
+
−
aLiMenu[i].index = i;
+
−
aLiMenu[i].onclick = function(){
+
−
prevIndex = iNow;
+
−
iNow = this.index;
+
−
toMove( this.index );
+
−
};
+
 
}
 
}
−
}
+
btn4.onclick=function () {
−
function toMove(index){
+
toMove(0);
−
oList.style.top = - index * iContentHeight + 'px';
+
iNow=0;
−
for(var i=0;i<aLiMenu.length;i++){
+
−
aLiMenu[i].className = '';
+
 
}
 
}
−
aLiMenu[index].className = 'active';
 
−
 
−
 
−
 
 
}
 
}
−
 
−
function contentAuto(){
 
−
iContentHeight = viewHeight() ;
 
−
oContent.style.height = iContentHeight + 'px';
 
−
for(var i=0;i<aLiList.length;i++){
 
−
aLiList[i].style.height = iContentHeight + 'px';
 
−
}
 
−
oList.style.top = - iNow * iContentHeight + 'px';
 
−
}
 
−
 
−
function listContentAuto(){
 
−
var mt = (iContentHeight - 520)/2;
 
−
for(var i=0;i<aDivList.length;i++){
 
−
aDivList[i].style.marginTop =  mt+'px';
 
−
}
 
−
}
 
−
 
−
function fnResize(){
 
−
contentAuto();
 
−
listContentAuto();
 
−
}
 
−
 
 
function mouseWheel(){
 
function mouseWheel(){
 
var bBtn = true;
 
var bBtn = true;
Line 166: Line 104:
 
 
 
}
 
}
 +
function showLoading(){
 +
var oSpan = oLoading.getElementsByTagName('span')[0];
 +
var aDiv = oLoading.getElementsByTagName('div');
 +
oSpan.style.width = '100%';
 +
oSpan.addEventListener('webkitTransitionend',spanChange,false);
 +
oSpan.addEventListener('transitionend',spanChange,false);
 +
function spanChange(){
 +
if(oSpan.style.width == '100%'){
 +
oSpan.style.display = 'none';
 +
aDiv[0].style.height = 0;
 +
aDiv[1].style.height = 0;
 +
}
 +
}
 +
aDiv[0].addEventListener('webkitTransitionend',divChange,false);
 +
aDiv[0].addEventListener('transitionend',divChange,false);
 
 
−
function homeContent(){
+
function divChange(){
−
var aLi1 = oHomeContent1.getElementsByTagName('li');
+
oLoading.parentNode.removeChild(oLoading);
−
var aLi2 = oHomeContent2.getElementsByTagName('li');
+
−
var oldIndex = 0;
+
−
var iNowHome = 0;
+
−
+
−
var data = [
+
−
{ text : 'one layer'},
+
−
{ text : 'two layer'},
+
−
{ text : 'three layer'},
+
−
{ text : 'four layer'}
+
−
];
+
−
create();
+
−
function create(){
+
−
for(var i=0;i<data.length;i++){
+
−
var oLi1 = document.createElement('li');
+
−
oLi1.innerHTML = '<h1 class="commonTitle">'+(data[i].text)+'</h1>';
+
−
var oLi2 = document.createElement('li');
+
−
if(i == 0){
+
−
oLi1.className = 'active';
+
−
oLi2.className = 'active';
+
−
}
+
−
oHomeContent1.appendChild(oLi1);
+
−
oHomeContent2.appendChild(oLi2);
+
−
}
+
−
+
 
}
 
}
 
 
−
for(var i=0;i<aLi2.length;i++){
+
}
−
aLi2[i].index = i;
+
 
−
aLi2[i].onclick = function(){
+
function bindNav(){
−
for(var i=0;i<aLi2.length;i++){
+
for(var i=0;i<aLiMenu.length;i++){
−
aLi2[i].className = '';
+
aLiMenu[i].index = i;
−
}
+
aLiMenu[i].onclick = function(){
−
this.className = 'active';
+
prevIndex = iNow;
−
+
iNow = this.index;
−
if( oldIndex < this.index ){  //从左向右
+
toMove( this.index );
−
aLi1[oldIndex].className = 'leftHide';
+
−
aLi1[this.index].className = 'rightShow';
+
−
}
+
−
else if( oldIndex > this.index ){  //从右向走
+
−
aLi1[oldIndex].className = 'rightHide';
+
−
aLi1[this.index].className = 'leftShow';
+
−
}
+
−
oldIndex = this.index;
+
−
iNowHome = this.index;
+
 
};
 
};
 
}
 
}
−
+
}
−
var timer = setInterval(change,3000);
+
function toMove(index){
−
+
oList.style.top = - index * iContentHeight + 'px';
−
oHomeContent.onmouseover = function(){
+
for(var i=0;i<aLiMenu.length;i++){
−
clearInterval(timer);
+
aLiMenu[i].className = '';
−
};
+
−
+
−
function change(){
+
−
iNowHome++;
+
−
+
−
if(iNowHome == aLi2.length){
+
−
iNowHome = 0;
+
−
}
+
−
+
−
for(var i=0;i<aLi2.length;i++){
+
−
aLi2[i].className = '';
+
−
}
+
−
aLi2[iNowHome].className = 'active';
+
−
aLi1[oldIndex].className = 'leftHide';
+
−
aLi1[iNowHome].className = 'rightShow';
+
−
+
−
oldIndex = iNowHome;
+
−
+
 
}
 
}
 +
aLiMenu[index].className = 'active';
 
}
 
}
 +
 +
function contentAuto(){
 +
iContentHeight = viewHeight() ;
 +
oContent.style.height = iContentHeight + 'px';
 +
for(var i=0;i<aLiList.length;i++){
 +
aLiList[i].style.height = iContentHeight + 'px';
 +
}
 +
oList.style.top = - iNow * iContentHeight + 'px';
 +
}
 +
 +
function fnResize(){
 +
contentAuto();
 +
}
 +
 
function $(id){
 
function $(id){
 
return document.getElementById(id);
 
return document.getElementById(id);
Line 265: Line 182:
 
</script>
 
</script>
 
<style type="text/css">
 
<style type="text/css">
 +
.button-next{    font-weight: bold;
 +
    font-family: "Lucida Console","Lucida Sans Typewriter",monaco,"Bitstream Vera Sans Mono",monospace;
 +
    position: absolute;
 +
    min-width: 180px;
 +
    min-height: 40px;
 +
  height: 7%;
 +
  width: 13%;
 +
  bottom: 1%;
 +
  background: #fff;
 +
  border: 1px solid #fff;
 +
  border-radius: 2px;
 +
  color: #222;
 +
  text-align: center;
 +
  cursor: pointer;
 +
  transition: .2s ease-in-out;
 +
  transform: translate(-50%, -50%);font-size: large;
 +
}
 +
.button-next:hover {
 +
  background: transparent;
 +
  color: #fff;
 +
}
 +
.myheader{height: 100%; text-align: center; background-color: rgba(255,255,255,0);margin:0 auto;position: relative;}
 +
.content{width:100%;}
 
li{ list-style:none;}
 
li{ list-style:none;}
 
#Qidilist{ width:100%; position:absolute; top:0; left:0; transition:.5s top;}
 
#Qidilist{ width:100%; position:absolute; top:0; left:0; transition:.5s top;}
Line 270: Line 210:
 
#lay-menu li{ width:10px; height:10px; border-radius:50%; margin:10px; border:1px black solid; cursor:pointer;}
 
#lay-menu li{ width:10px; height:10px; border-radius:50%; margin:10px; border:1px black solid; cursor:pointer;}
 
#lay-menu li.active{ background:black; cursor:default;}
 
#lay-menu li.active{ background:black; cursor:default;}
−
#home{ background:url(https://static.igem.org/mediawiki/2017/3/38/Team-NUDT_CHINAimage1.jpg); overflow-x: hidden; top: 0px;height: 100%;width: 100%;}
 
−
#abstract{ background:url(https://static.igem.org/mediawiki/2017/3/38/Team-NUDT_CHINAimage1.jpg); overflow-x: hidden; top: 0px;height: 100%;width: 100%;}
 
−
#Team{ background:url(https://static.igem.org/mediawiki/2017/3/38/Team-NUDT_CHINAimage1.jpg); overflow-x: hidden; top: 0px;height: 100%;width: 100%;}
 
−
#homeContent .homeContent1{ width:100%; height:100%; position:relative; perspective:800px; transform-style:preserve-3d; -webkit-perspective:800px; -webkit-transform-style:preserve-3d; transition:1s;}
 
−
#homeContent .homeContent1 li{  width:100%; height:100%; position:absolute; left:0; top:0; background:black; visibility:hidden;}
 
−
#homeContent .homeContent1 li:nth-of-type(1){background:#dc6c5f;}
 
−
#homeContent .homeContent1 li:nth-of-type(2){background:#95dc84;}
 
−
#homeContent .homeContent1 li:nth-of-type(3){background:#64b9d2;}
 
−
#homeContent .homeContent1 li h1{ color:white; text-align:center; padding-top:200px;}
 
−
#homeContent .homeContent1 li.active{ z-index:1; visibility:visible;}
 
−
#homeContent h1{border-bottom: none;}
 
−
#homeContent .homeContent2{ position:absolute; bottom:0; z-index:2; text-align:center; width:100%; transition:1s;}
 
−
#homeContent .homeContent2 li{ width:20px; height:20px; border-radius:50%; background:rgba(255,255,255,0.5); display:inline-block; margin:2px; box-shadow:0 0 4px rgba(25,25,25,0.8); cursor:pointer;}
 
−
#homeContent .homeContent2 li.active{ background:white; cursor:default;}
 
  
−
#homeContent .homeContent1 .leftShow{ animation:1s homeLeftShow; visibility:visible; z-index:3;-webkit-animation:1s homeLeftShow;}
+
.myheader img{width:100%; margin: 0;position: absolute; top: 50%;transform: translate(0, -50%); left: 0;max-height: 80%;}
−
#homeContent .homeContent1 .rightHide{ animation:1s homeRightHide; visibility:hidden; -webkit-animation:1s homeRightHide;}
+
.myheader h1{width:100%; margin: 0;position: absolute; top: 40%;transform: translate(0, -50%); left: 0;max-height: 80%;font-size:78px; font-family:"Comic Sans MS",cursive;border-bottom: none;padding-bottom:40px;line-height:normal;}
−
 
+
.myheader h3{width:100%; margin: 0;position: absolute; top: 60%;transform: translate(0, -50%); left: 0;max-height: 80%;font-size:30px;border-bottom: none;font-weight:initial;font-family: "Big Caslon","Book Antiqua","Palatino Linotype",Georgia,serif;line-height:normal;}
−
 
+
−
#homeContent .homeContent1 .leftHide{ animation:1s homeLeftHide; visibility:hidden; -webkit-animation:1s homeLeftHide;}
+
−
#homeContent .homeContent1 .rightShow{ animation:1s homeRightShow; visibility:visible; z-index:3; -webkit-animation:1s homeRightShow;}
+
−
</style>
+
−
<style type="text/css">
+
−
@keyframes homeLeftHide{
+
−
0%{ transform:translateZ(0px); visibility:visible;}
+
−
40%{ transform:translate(-40%,0) scale(0.8) rotateY(20deg);}
+
−
100%{ transform:translateZ(-200px);}
+
−
}
+
−
@keyframes homeRightShow{
+
−
0%{ transform:translateZ(-200px);}
+
−
40%{ transform:translate(40%,0) scale(0.8) rotateY(-20deg);}
+
−
100%{ transform:translateZ(0px);}
+
−
}
+
−
 
+
−
@-webkit-keyframes homeLeftHide{
+
−
0%{ -webkit-transform:translateZ(0px); visibility:visible;}
+
−
40%{ -webkit-transform:translate(-40%,0) scale(0.8) rotateY(20deg);}
+
−
100%{ -webkit-transform:translateZ(-200px);}
+
−
}
+
−
@-webkit-keyframes homeRightShow{
+
−
0%{ -webkit-transform:translateZ(-200px);}
+
−
40%{ -webkit-transform:translate(40%,0) scale(0.8) rotateY(-20deg);}
+
−
100%{ -webkit-transform:translateZ(0px);}
+
−
}
+
−
 
+
−
@keyframes homeLeftShow{
+
−
0%{ transform:translateZ(-200px);}
+
−
40%{ transform:translate(-40%,0) scale(0.8) rotateY(20deg);}
+
−
100%{ transform:translateZ(0px);}
+
−
}
+
−
@keyframes homeRightHide{
+
−
0%{ transform:translateZ(0px); visibility:visible;}
+
−
40%{ transform:translate(40%,0) scale(0.8) rotateY(-20deg);}
+
−
100%{ transform:translateZ(-200px);}
+
−
}
+
−
@-webkit-keyframes homeLeftShow{
+
−
0%{ -webkit-transform:translateZ(-200px);}
+
−
40%{ -webkit-transform:translate(-40%,0) scale(0.8) rotateY(20deg);}
+
−
100%{ -webkit-transform:translateZ(0px);}
+
−
}
+
−
@-webkit-keyframes homeRightHide{
+
−
0%{ -webkit-transform:translateZ(0px); visibility:visible;}
+
−
40%{ -webkit-transform:translate(40%,0) scale(0.8) rotateY(-20deg);}
+
−
100%{ -webkit-transform:translateZ(-200px);}
+
−
}
+
−
/* home end */
+
−
</style>
+
−
 
+
−
<style type="text/css">
+
−
 
+
−
.Myheader{border-bottom: none;}
+
 
#loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;text-align: center;}
 
#loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;text-align: center;}
 
#loading div:nth-of-type(1){ top:0;}
 
#loading div:nth-of-type(1){ top:0;}
 
#loading div:nth-of-type(2){ bottom:0;}
 
#loading div:nth-of-type(2){ bottom:0;}
 
#loading span{ width:0%; height:4px; background:white; position:absolute; left:0; top:50%; margin-top:-2px; z-index:60; transition:.10s;}
 
#loading span{ width:0%; height:4px; background:white; position:absolute; left:0; top:50%; margin-top:-2px; z-index:60; transition:.10s;}
−
 
 
body {
 
body {
 
     color: #777;
 
     color: #777;
 
}
 
}
−
 
+
#Qidilist .liList{ width:100%; position:relative; overflow:hidden;text-align: center;left:-30px;}
−
@media (min-width: 88em) {
+
.big-bg{position:absolute; top:0;left:0;height:100%;width:100%; z-index:9;}
−
    .Myheader,
+
@media (min-width: 92em) {
−
    .content {
+
   .myheader {
−
        padding-left: 2em;
+
        width: 85%;}
−
        padding-right: 2em;
+
−
    }
+
−
    #layout {
+
−
        padding-left: 240px; /* left col width "#menu" */
+
−
        left: 0;
+
−
    }
+
−
    #menu {
+
−
        left: 240px;
+
−
    }
+
−
    .menu-link {
+
−
        position: fixed;
+
−
        left: 240px;
+
−
        display: none;
+
−
    }
+
−
    #layout.active .menu-link {
+
−
        left: 240px;
+
−
    }
+
−
#Qidilist .liList{ width:2050px; position:relative; left:50%; margin-left:-750px; overflow:hidden;text-align: center;}
+
−
  #Qidilist .divList{ width:1200px; height:520px; margin:0px auto; position:relative;}
+
−
   .myheader{width: 1000px;}
+
−
  .Myheader{margin-top:4em;}
+
 
}
 
}
−
 
+
@media (max-width: 92em) {
−
@media (max-width: 88em) {
+
  .myheader {
−
    #layout.active {
+
         width: 85%;}
−
         position: relative;
+
}
−
        left: 240px;
+
@media (max-width: 45em) {
−
    }
+
   .myheader {
−
    #Qidilist .liList{ width:1800px; position:relative; left:50%; margin-left:-750px; overflow:hidden;text-align: center;}
+
        width: 100%;}
−
    #Qidilist .divList{ width:1050px; height:500px; margin:0px auto; position:relative;}
+
−
   .myheader{width:800px;}
+
−
  .Myheader{margin-top:1em;}
+
 
}
 
}
  
−
    </style>
+
.next-button {z-index:10;position:absolute;font-weight: bold;
−
   
+
    font-family: "Lucida Console","Lucida Sans Typewriter",monaco,"Bitstream Vera Sans Mono",monospace;
−
  <style type="text/css">
+
  top: 40%;
−
.myheader {
+
  left: 50%;font-size:29px;font-weight:10px;
−
    margin:0 auto;
+
   z-index: 10;
−
    background-color:rgba(255,255,255,0.85);
+
   padding: 1em 2.5em;
−
   
+
   background: #fff;
−
   
+
   border: 1px solid #fff;
−
}
+
−
    .myheader h5 {
+
−
    font-family: 'Monad';
+
−
        margin-bottom:1em;
+
−
        font-size: 4.2em;
+
−
        font-weight: 300;
+
−
    border-bottom:none;
+
−
    }
+
−
    .myheader h6 {
+
−
      line-height: 1.2;
+
−
      text-align: left;
+
−
    font-size: 2.3em;
+
−
    color: grey;
+
−
      font-weight: 300;
+
−
      margin-top: 2px;
+
−
    }
+
−
.button-after {
+
−
   display: inline-block;
+
−
  margin:o auto;
+
−
   padding: .65em 4em;
+
−
   background: -webkit-linear-gradient(#fe5f95 , #ff3f7f);
+
−
  background: linear-gradient(#fe5f95 , #ff3f7f);
+
−
   border: 1px solid #fe3276;
+
 
   border-radius: 4px;
 
   border-radius: 4px;
−
   color: #fff;
+
   color: #222;
−
   text-decoration: none;
+
   font-size: large;
 
   text-align: center;
 
   text-align: center;
−
   -webkit-transition: .3s ease-in-out;
+
   cursor: pointer;
−
   transition: .3s ease-in-out;
+
   transition: .2s ease-in-out;
−
  margin-bottom: 0px;
+
   transform: translate(-50%, -50%);}
−
}
+
−
.button-after:hover {
+
−
  -webkit-animation: bounce 2s ease-in-out;
+
−
   animation: bounce 2s ease-in-out;
+
−
}
+
−
@-webkit-keyframes bounce {
+
−
  5%  { -webkit-transform: scale(1.1, .8); }
+
−
  10% { -webkit-transform: scale(.8, 1.1) translateY(-5px); }
+
−
  15% { -webkit-transform: scale(1, 1); }
+
−
}
+
−
@keyframes bounce {
+
−
  5%  { transform: scale(1.1, .8); }
+
−
  10% { transform: scale(.8, 1.1) translateY(-5px); }
+
−
  15% { transform: scale(1, 1); }
+
−
}</style> 
+
−
 
+
−
<style type="text/css">
+
−
.next-button {
+
−
  display: inline-block;
+
−
  width: 120px;
+
−
  height: 120px;
+
−
  line-height: 120px;
+
−
  background: -webkit-linear-gradient(#00000F , #000000);
+
−
  background: linear-gradient(#00000F , #000000);
+
−
  border: 1px solid #000000;
+
−
  border-radius: 50%;
+
−
  color: white;
+
−
  text-decoration: none;
+
−
  text-align: center;
+
−
}
+
 
.next-button:hover {
 
.next-button:hover {
−
   -webkit-animation: scale .3s ease-in-out;
+
   background: transparent;
−
   animation: scale .3s ease-in-out;
+
   color: #fff;
−
}
+
−
@-webkit-keyframes scale {
+
−
  50% { -webkit-transform: scale(1.1); }
+
−
}
+
−
@keyframes scale {
+
−
  50% { transform: scale(1.1); }
+
 
}
 
}
 +
.under-bg{z-index: 0.5;opacity: 1; position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
 
</style>
 
</style>
−
</head>
 
  
 +
</head>
 +
<img class="under-bg" src="https://static.igem.org/mediawiki/2017/c/cc/T-NUDT_CHINA-MainPage1.jpg" alt="">
 +
<div id="loading">
 +
    <div><img src="https://static.igem.org/mediawiki/2017/1/17/T-NUDT_CHINA-loadingBg3.jpg" alt="" class="big-bg"></div>
 +
        <div><img src="https://static.igem.org/mediawiki/2017/a/ab/T-NUDT_CHINA-loadingBg4.jpg" alt="" class="big-bg">
 +
            <a class="next-button" id="next-button">Get Started!</a>
 +
        </div>
 +
        <span></span>
 +
    </div>
 
    
 
    
 
   <div id="layout">
 
   <div id="layout">
Line 477: Line 275:
 
         <div class="pure-menu"><img src="https://static.igem.org/mediawiki/2017/4/4f/T-NUDT_CHINA-icon01.png" width=240px height=190px alt="">
 
         <div class="pure-menu"><img src="https://static.igem.org/mediawiki/2017/4/4f/T-NUDT_CHINA-icon01.png" width=240px height=190px alt="">
 
           <ul class="pure-menu-list">
 
           <ul class="pure-menu-list">
−
             <li class="pure-menu-item"><a class="pure-menu-heading" href="https://2017.igem.org/Team:NUDT_CHINA" class="pure-menu-link">HOME</a></li>               
+
             <li class="pure-menu-item"><a class="pure-menu-heading" href="https://2017.igem.org/Team:NUDT_CHINA" class="pure-menu-link">HOME</a></li>               
 
            
 
            
 
             <li class="pure-menu-item pure-menu-has-children">
 
             <li class="pure-menu-item pure-menu-has-children">
Line 493: Line 291:
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Experiments" class="pure-menu-link">Experiment</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Experiments" class="pure-menu-link">Experiment</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Notebook" class="pure-menu-link">Notebook</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Notebook" class="pure-menu-link">Notebook</a></li>
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/InterLab" class="pure-menu-link">InterLab</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Contribution" class="pure-menu-link">Contribution</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Model" class="pure-menu-link">Model</a></li>
 
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Results" class="pure-menu-link">Results</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Results" class="pure-menu-link">Results</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Demonstrate" class="pure-menu-link">Demonstrate</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Demonstrate" class="pure-menu-link">Demonstrate</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Improve" class="pure-menu-link">Improve</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Improve" class="pure-menu-link">Improve</a></li>
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Attributions" class="pure-menu-link">Attributions</a></li>
 
 
             </ul>
 
             </ul>
 
             </li>
 
             </li>
Line 511: Line 305:
 
             </ul>
 
             </ul>
 
             </li>
 
             </li>
 +
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Attributions" class="pure-menu-link">Attributions</a></li>
 +
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/InterLab" class="pure-menu-link">InterLab</a></li>
 +
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Model" class="pure-menu-link">Model</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Safety" class="pure-menu-link">SAFETY</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Safety" class="pure-menu-link">SAFETY</a></li>
 
             <li class="pure-menu-item pure-menu-has-children">
 
             <li class="pure-menu-item pure-menu-has-children">
 
               <a  class="pure-menu-link"onclick="Show('HP_show')">HP</a>
 
               <a  class="pure-menu-link"onclick="Show('HP_show')">HP</a>
 
               <ul class="pure-menu-children" id="HP_show">
 
               <ul class="pure-menu-children" id="HP_show">
−
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/HP/Silver" class="pure-menu-link">Sliver HP</a></li>
+
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/HP/Silver" class="pure-menu-link">Silver HP</a></li>
−
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/HP/Gold_Integrated" class="pure-menu-link">Integrated and Gold</a></li>
+
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/HP/Gold_Integrated" class="pure-menu-link">Integrated & Gold</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Engagement" class="pure-menu-link">Public Engagement</a></li>
 
                 <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Engagement" class="pure-menu-link">Public Engagement</a></li>
 
             </ul>
 
             </ul>
 
             </li>
 
             </li>
−
            <li class="pure-menu-item pure-menu-has-children">
 
−
              <a  class="pure-menu-link"onclick="Show('award_show')">AWARDS</a>
 
−
              <ul class="pure-menu-children" id="award_show">
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Applied_Design" class="pure-menu-link">Applied Design</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Entrepreneurship" class="pure-menu-link">Enterpreneurship</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Hardware" class="pure-menu-link">Hardware</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Measurement" class="pure-menu-link">Measurement</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Model" class="pure-menu-link">Model</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Plant" class="pure-menu-link">Plant</a></li>
 
−
                <li class="pure-menu-item"><a href="https://2017.igem.org/Team:NUDT_CHINA/Software" class="pure-menu-link">Software</a></li>
 
−
            </ul>
 
−
            </li>
 
−
               
 
 
             </ul>
 
             </ul>
 
         </div>   
 
         </div>   
 
         </div>
 
         </div>
−
 
+
        <div id="content" class="content">
−
 
+
    <ul id="lay-menu">
 +
        <li class="active"></li>
 +
            <li></li>
 +
            <li></li>
 +
            <li></li>
 +
        </ul>
 +
    <ul id="Qidilist">
 +
      <li id="abstract" class="liList">
 +
            <div class="myheader"id="main"><h1>MiRNA &nbsp;&nbsp;Locker</h1><h3>A Modularized DNA Assembly As miRNA Inhibitors</h3><button id="btn1" class="button-next">How it works?</button></div>
 +
            </li>
 +
      <li id="abstract" class="liList">
 +
            <div class="myheader"id="main"><img class="strory-telling1" src="https://static.igem.org/mediawiki/2017/a/ad/T-NUDT_CHINA-story1.png" no-repeat; ><button id="btn2" class="button-next">Next</button></div>
 +
            </li>
 +
      <li id="abstract" class="liList">
 +
            <div class="myheader"id="main"><img class="strory-telling2" src="https://static.igem.org/mediawiki/2017/3/35/T-NUDT_CHINA-story2.png" no-repeat; ><button id="btn3" class="button-next">Next</button></div>
 +
            </li>
 +
      <li id="abstract" class="liList">
 +
            <div class="myheader"id="main"><img class="strory-telling3" src="https://static.igem.org/mediawiki/2017/1/1e/T-NUDT_CHINA-story3.png" no-repeat; ><button id="btn4" class="button-next">Back</button></div>
 +
            </li>
 +
   
 +
        </ul>
 +
        </div>
 
          
 
          
−
        <div class="Myheader">
 
−
            <h1>Model</h1>
 
−
            <h2>Development of A Novel Blood-MicroRNA Handy Detection System with CRISPR</h2>
 
−
        </div>
 
−
 
−
        <div class="content">
 
−
           
 
−
 
−
 
−
 
 
</div>
 
</div>
 
<script type="text/javascript">
 
<script type="text/javascript">

Latest revision as of 02:17, 2 November 2017

HOME
TEAM
PROJECT
Description
Design
Experiments
Notebook
InterLab
Contribution
Model
Results
Demonstrate
Improve
Attributions
PARTS
Parts
Basic Parts
Composite Parts
Part Collection
SAFETY
HUMAN PRACTICES
Silver HP
Integrated and Gold
Public Engagement
AWARDS
Applied Design
Entrepreneurship
Hardware
Measurement
Model
Plant
Software
JUDGING FORM
Team:NUDT_CHINA