Difference between revisions of "Team:NUDT CHINA"

 
(52 intermediate revisions by the same user not shown)
Line 17: Line 17:
 
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();
 
mouseWheel();
 
mouseWheel();
 
bindNav();
 
bindNav();
 
add1();
 
add1();
 +
add2();
 
window.onresize = fnResize;   
 
window.onresize = fnResize;   
 
function add1() {
 
function add1() {
Line 26: Line 31:
 
showLoading();
 
showLoading();
 
};
 
};
 +
}
 +
function add2() {
 +
btn1.onclick=function () {
 +
toMove(1);
 +
iNow=1;
 +
}
 +
btn2.onclick=function () {
 +
toMove(2);
 +
iNow=2;
 +
}
 +
btn3.onclick=function () {
 +
toMove(3);
 +
iNow=3;
 +
}
 +
btn4.onclick=function () {
 +
toMove(0);
 +
iNow=0;
 +
}
 
}
 
}
 
function mouseWheel(){
 
function mouseWheel(){
Line 159: Line 182:
 
</script>
 
</script>
 
<style type="text/css">
 
<style type="text/css">
.myheader{height: 100%; text-align: center; background-color: rgba(255,255,255,0.3);margin:0 auto;position: relative;}
+
.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%;}
 
.content{width:100%;}
 
li{ list-style:none;}
 
li{ list-style:none;}
Line 167: Line 211:
 
#lay-menu li.active{ background:black; cursor:default;}
 
#lay-menu li.active{ background:black; cursor:default;}
  
.myheader img{width:100%; margin: 0 auto;left:0;max-height:100%;
+
.myheader img{width:100%; margin: 0;position: absolute;  top: 50%;transform: translate(0, -50%); left: 0;max-height: 80%;}
position: absolute;   
+
.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;}
  top: 50%;
+
.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;}
  transform: translate(0, -50%)}
+
 
#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;}
 
#Qidilist .liList{ width:100%; position:relative;  overflow:hidden;text-align: center;left:-30px;}
 
.big-bg{position:absolute; top:0;left:0;height:100%;width:100%; z-index:9;}
 
.big-bg{position:absolute; top:0;left:0;height:100%;width:100%; z-index:9;}
 
@media (min-width: 92em) {
 
@media (min-width: 92em) {
 
   .myheader {
 
   .myheader {
         width: 70%;}
+
         width: 85%;}
 
}
 
}
 
@media (max-width: 92em) {
 
@media (max-width: 92em) {
 
   .myheader {
 
   .myheader {
         width: 80%;}
+
         width: 85%;}
 
}
 
}
 
@media (max-width: 45em) {
 
@media (max-width: 45em) {
Line 195: Line 236:
 
}
 
}
  
.next-button {z-index:10;position:absolute;
+
.next-button {z-index:10;position:absolute;font-weight: bold;
 +
    font-family: "Lucida Console","Lucida Sans Typewriter",monaco,"Bitstream Vera Sans Mono",monospace;
 
   top: 40%;
 
   top: 40%;
   left: 50%;
+
   left: 50%;font-size:29px;font-weight:10px;
 
   z-index: 10;
 
   z-index: 10;
 
   padding: 1em 2.5em;
 
   padding: 1em 2.5em;
Line 204: Line 246:
 
   border-radius: 4px;
 
   border-radius: 4px;
 
   color: #222;
 
   color: #222;
   font-size: 16px;
+
   font-size: large;
 
   text-align: center;
 
   text-align: center;
 
   cursor: pointer;
 
   cursor: pointer;
Line 213: Line 255:
 
   color: #fff;
 
   color: #fff;
 
}
 
}
.under-bg{z-index: 0.5;opacity: 0.8; position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
+
.under-bg{z-index: 0.5;opacity: 1; position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
 
</style>
 
</style>
  
Line 233: 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 249: 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 267: 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 295: 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>
Line 302: Line 329:
 
     <ul id="Qidilist">
 
     <ul id="Qidilist">
 
       <li id="abstract" class="liList">
 
       <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; ></div>
+
            <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>
 
       <li id="abstract" class="liList">
 
       <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; ></div>
+
             <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>
 
       <li id="abstract" 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; ></div>
+
             <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>
 
    
 
    

Latest revision as of 02:17, 2 November 2017

Team:NUDT_CHINA