Difference between revisions of "Team:NUDT CHINA"

 
(147 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(){
−
function homeContent(){
+
var oSpan = oLoading.getElementsByTagName('span')[0];
−
var aLi1 = oHomeContent1.getElementsByTagName('li');
+
var aDiv = oLoading.getElementsByTagName('div');
−
var aLi2 = oHomeContent2.getElementsByTagName('li');
+
oSpan.style.width = '100%';
−
var oldIndex = 0;
+
oSpan.addEventListener('webkitTransitionend',spanChange,false);
−
var iNowHome = 0;
+
oSpan.addEventListener('transitionend',spanChange,false);
−
+
function spanChange(){
−
var data = [
+
if(oSpan.style.width == '100%'){
−
{ text : 'one layer'},
+
oSpan.style.display = 'none';
−
{ text : 'two layer'},
+
aDiv[0].style.height = 0;
−
{ text : 'three layer'},
+
aDiv[1].style.height = 0;
−
{ 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);
+
 
}
 
}
−
+
}
 +
aDiv[0].addEventListener('webkitTransitionend',divChange,false);
 +
aDiv[0].addEventListener('transitionend',divChange,false);
 +
 +
function divChange(){
 +
oLoading.parentNode.removeChild(oLoading);
 
}
 
}
 
 
−
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 id="loading">
−
     <div></div>
+
     <div><img src="https://static.igem.org/mediawiki/2017/1/17/T-NUDT_CHINA-loadingBg3.jpg" alt="" class="big-bg"></div>
−
         <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>
 
             <a class="next-button" id="next-button">Get Started!</a>
 
         </div>
 
         </div>
Line 483: 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 499: 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 517: 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>   
Line 545: Line 323:
 
     <ul id="lay-menu">
 
     <ul id="lay-menu">
 
         <li class="active"></li>
 
         <li class="active"></li>
 +
            <li></li>
 
             <li></li>
 
             <li></li>
 
             <li></li>
 
             <li></li>
 
         </ul>
 
         </ul>
 
     <ul id="Qidilist">
 
     <ul id="Qidilist">
−
    <li id="abstract" class="liList">
+
      <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>
−
                <div class="Myheader" id="main" ><div class="myheader">
+
             </li>
−
            <h5>NUDT_CHINA</h5>
+
      <li id="abstract" class="liList">
−
            <h6>MicroRNAs (miRNAs) have been proven to play important roles on post-transcriptionalregulation of the gene expression by direct base pairing to target sites within untranslated regions of messenger RNAs.</h6>
+
            <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>
−
            <br><h6>However, the functions of most microRNAs remain to be discovered. Our project attempts to develop a novel sponge for miRNAs, which would knock down the abundance of target miRNA in the cells. </h6>
+
−
             <br><h6>Thus the sponge will be a miRNA inhibitor to be used to induce miRNA loss-of-function phenotypes or other further applications like small non-coding RNA-based diagnostic and therapeutic applications.</h6>
+
−
              </div></div>
+
−
              <a class="button-after" id="button-after-1">Our Story</a>
+
 
             </li>
 
             </li>
−
    <li id="home" class="liList">
+
      <li id="abstract" class="liList">
−
            <div id="homeContent" class="divList">
+
            <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>
−
                <ul class="homeContent1">
+
−
                    </ul>
+
−
                    <ul class="homeContent2">
+
−
                    </ul>
+
−
                </div>
+
−
                <a class="button-after" id="button-after-2">Daily Pics</a>
+
 
             </li>
 
             </li>
−
       <li id="Team" class="liList">
+
       <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>
−
                <a class="button-after" id="button-after-3">Back</a>
+
 
             </li>
 
             </li>
 
    
 
    
−
       
 
 
         </ul>
 
         </ul>
 
         </div>
 
         </div>

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