Difference between revisions of "Team:NUDT CHINA"

 
(204 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
 
 
{{NUDT_CHINA}}
 
{{NUDT_CHINA}}
 
<html lang="en">
 
<html lang="en">
Line 6: Line 5:
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <title>Team:NUDT_CHINA</title>
 
     <title>Team:NUDT_CHINA</title>
−
    <link rel="stylesheet" href="basic.css">
 
 
<script type="text/javascript" >
 
<script type="text/javascript" >
 
  window.onload=function(){
 
  window.onload=function(){
Line 13: 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 aLiMenu = oMenu.getElementsByTagName('li');
 
var aLiMenu = oMenu.getElementsByTagName('li');
−
 
 
var iNow = 0;
 
var iNow = 0;
 
var prevIndex = 0;
 
var prevIndex = 0;
 
var iContentHeight = 0;
 
var iContentHeight = 0;
−
showLoading();
+
var btn1 = $('btn1');
 +
var btn2 = $('btn2');
 +
var btn3 = $('btn3');
 +
var btn4 = $('btn4');
 
contentAuto();
 
contentAuto();
−
listContentAuto();
 
−
bindNav();
 
 
mouseWheel();
 
mouseWheel();
−
homeContent();
+
bindNav();
 +
add1();
 +
add2();
 
window.onresize = fnResize;   
 
window.onresize = fnResize;   
−
 
+
function add1() {
−
function showLoading(){
+
oNextBtn.onclick=function () {
−
var oSpan = oLoading.getElementsByTagName('span')[0];
+
showLoading();
−
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);
+
−
}
+
−
+
 
}
 
}
−
 
+
function add2() {
−
function bindNav(){
+
btn1.onclick=function () {
−
for(var i=0;i<aLiMenu.length;i++){
+
toMove(1);
−
aLiMenu[i].index = i;
+
iNow=1;
−
aLiMenu[i].onclick = function(){
+
−
prevIndex = iNow;
+
−
iNow = this.index;
+
−
toMove( this.index );
+
−
};
+
 
}
 
}
−
}
+
btn2.onclick=function () {
−
+
toMove(2);
−
function toMove(index){
+
iNow=2;
−
oList.style.top = - index * iContentHeight + 'px';
+
−
for(var i=0;i<aLiMenu.length;i++){
+
−
aLiMenu[i].className = '';
+
 
}
 
}
−
aLiMenu[index].className = 'active';
+
btn3.onclick=function () {
−
+
toMove(3);
−
+
iNow=3;
−
+
−
}
+
−
+
−
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';
+
btn4.onclick=function () {
−
}
+
toMove(0);
−
+
iNow=0;
−
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 151: 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 250: Line 182:
 
</script>
 
</script>
 
<style type="text/css">
 
<style type="text/css">
−
<!--li{ list-style:none;}
+
.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;}
 
#Qidilist{ width:100%; position:absolute; top:0; left:0; transition:.5s top;}
 
#Qidilist{ width:100%; position:absolute; top:0; left:0; transition:.5s top;}
−
#Qidilist .liList{ width:2000px; position:relative; left:50%; margin-left:-800px; overflow:hidden;}
 
 
#lay-menu{ position:fixed; right:0; top:50%; z-index:20;}
 
#lay-menu{ position:fixed; right:0; top:50%; z-index:20;}
−
#lay-menu li{ width:10px; height:10px; border-radius:50%; margin:10px; border:1px white 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:white; cursor:default;}
+
#lay-menu li.active{ background:black; cursor:default;}
−
#home{ background:url(img/bg1.jpg) no-repeat; overflow-x: hidden;top: 0px;height: 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;}
−
 
+
#loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;text-align: center;}
−
#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">
+
−
 
+
−
 
+
−
#loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;}
+
 
#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;}
−
 
+
@media (min-width: 92em) {
−
   
+
  .myheader {
−
    #Qidilist .divList{ width:1100px; height:520px; margin:0px auto; position:relative;}
+
        width: 85%;}
 +
}
 +
@media (max-width: 92em) {
 +
  .myheader {
 +
        width: 85%;}
 +
}
 +
@media (max-width: 45em) {
 +
  .myheader {
 +
        width: 100%;}
 
}
 
}
  
−
@media (max-width: 88em) {
+
.next-button {z-index:10;position:absolute;font-weight: bold;
−
      
+
     font-family: "Lucida Console","Lucida Sans Typewriter",monaco,"Bitstream Vera Sans Mono",monospace;
−
    #Qidilist .divList{ width:900px; height:500px; margin:0px auto; position:relative;}
+
  top: 40%;
 +
  left: 50%;font-size:29px;font-weight:10px;
 +
  z-index: 10;
 +
  padding: 1em 2.5em;
 +
  background: #fff;
 +
  border: 1px solid #fff;
 +
  border-radius: 4px;
 +
  color: #222;
 +
  font-size: large;
 +
  text-align: center;
 +
  cursor: pointer;
 +
  transition: .2s ease-in-out;
 +
  transform: translate(-50%, -50%);}
 +
.next-button:hover {
 +
  background: transparent;
 +
  color: #fff;
 
}
 
}
−
 
+
.under-bg{z-index: 0.5;opacity: 1; position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
−
    </style>
+
</style>
  
 
</head>
 
</head>
−
<body>
+
<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><img src="https://static.igem.org/mediawiki/2017/1/17/T-NUDT_CHINA-loadingBg3.jpg" alt="" class="big-bg"></div>
−
     <div></div>
+
         <div><img src="https://static.igem.org/mediawiki/2017/a/ab/T-NUDT_CHINA-loadingBg4.jpg" alt="" class="big-bg">
−
         <div>
+
            <a class="next-button" id="next-button">Get Started!</a>
 
         </div>
 
         </div>
 
         <span></span>
 
         <span></span>
 
     </div>
 
     </div>
 +
 
 
   <div id="layout">
 
   <div id="layout">
 
         <a href="#menu" id="menuLink" class="menu-link">
 
         <a href="#menu" id="menuLink" class="menu-link">
Line 363: 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 379: 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 397: 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">
−
   
+
−
<div id="content"class="content">
+
 
     <ul id="lay-menu">
 
     <ul id="lay-menu">
 
         <li class="active"></li>
 
         <li class="active"></li>
Line 432: Line 328:
 
         </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">
+
−
            <h1>NUDT_CHINA</h1>
+
−
            <h2>The abstract of our work</h2>
+
−
              </div>
+
−
             
+
 
             </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-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>
−
                <ul class="homeContent1">
+
            </li>
−
                    </ul>
+
      <li id="abstract" class="liList">
−
                    <ul class="homeContent2">
+
            <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>
+
            </li>
−
                </div>
+
      <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>
 
             </li>
 
    
 
    
−
       
 
 
         </ul>
 
         </ul>
 
         </div>
 
         </div>
Line 455: Line 346:
 
</div>
 
</div>
 
<script type="text/javascript">
 
<script type="text/javascript">
−
(function (window, document) {
+
( function(window,document){
  
 
     var layout  = document.getElementById('layout'),
 
     var layout  = document.getElementById('layout'),
 
         menu    = document.getElementById('menu'),
 
         menu    = document.getElementById('menu'),
 
         menuLink = document.getElementById('menuLink'),
 
         menuLink = document.getElementById('menuLink'),
−
         content  = document.getElementById('content');
+
         content  = document.getElementById('main');
−
   
+
 
−
if (typeof menuLink !== 'undefined') {
+
−
  // Now we know that foo is defined, we are good to go.
+
−
}
+
 
     function toggleClass(element, className) {
 
     function toggleClass(element, className) {
 
         var classes = element.className.split(/\s+/),
 
         var classes = element.className.split(/\s+/),
Line 496: Line 384:
 
         toggleAll(e);
 
         toggleAll(e);
 
     };
 
     };
 +
 
     content.onclick = function(e) {
 
     content.onclick = function(e) {
 
         if (menu.className.indexOf('active') !== -1) {
 
         if (menu.className.indexOf('active') !== -1) {
Line 501: Line 390:
 
         }
 
         }
 
     };
 
     };
−
 
−
 
  
 
}(this, this.document));
 
}(this, this.document));

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