Difference between revisions of "Template:Jilin China Menu"

 
(33 intermediate revisions by the same user not shown)
Line 65: Line 65:
 
font-size:0.5em; text-align:justify; padding:0 15px 0 15px; overflow: auto; max-height:60%;width:90%; background-color:rgba(151,151,151,0.35); align-content:center; margin:auto;
 
font-size:0.5em; text-align:justify; padding:0 15px 0 15px; overflow: auto; max-height:60%;width:90%; background-color:rgba(151,151,151,0.35); align-content:center; margin:auto;
 
}
 
}
 +
.Rcontent{float: right; width: 50%; margin: 1% 3% 0 0}
 
.section-wrap .section .title.active .tit{ opacity:1;transform:translateY(-25px);-webkit-transform:translateY(-25px);transition:all 2s cubic-bezier(0.86,0,0.8,1);-webkit-transition:all 2s cubic-bezier(0.86,0,0.8,1);}
 
.section-wrap .section .title.active .tit{ opacity:1;transform:translateY(-25px);-webkit-transform:translateY(-25px);transition:all 2s cubic-bezier(0.86,0,0.8,1);-webkit-transition:all 2s cubic-bezier(0.86,0,0.8,1);}
 
.section-wrap .section-1{ background-color:rgba(51,112,81,0.3)}
 
.section-wrap .section-1{ background-color:rgba(51,112,81,0.3)}
Line 76: Line 77:
 
.put-section-3{ transform:translateY(-300%);-webkit-transform:translateY(-300%);}
 
.put-section-3{ transform:translateY(-300%);-webkit-transform:translateY(-300%);}
 
.put-section-4{ transform:translateY(-400%);-webkit-transform:translateY(-400%);}
 
.put-section-4{ transform:translateY(-400%);-webkit-transform:translateY(-400%);}
 +
.put-section-5{ transform:translateY(-500%);-webkit-transform:translateY(-500%);}
 +
.put-section-6{ transform:translateY(-600%);-webkit-transform:translateY(-600%);}
 +
.put-section-7{ transform:translateY(-700%);-webkit-transform:translateY(-700%);}
 +
.put-section-8{ transform:translateY(-800%);-webkit-transform:translateY(-800%);}
 +
.put-section-9{ transform:translateY(-900%);-webkit-transform:translateY(-900%);}
 +
.put-section-10{ transform:translateY(-1000%);-webkit-transform:translateY(-1000%);}
 +
.put-section-11{ transform:translateY(-1100%);-webkit-transform:translateY(-1100%);}
 +
.put-section-12{ transform:translateY(-1200%);-webkit-transform:translateY(-1200%);}
 +
.put-section-13{ transform:translateY(-1300%);-webkit-transform:translateY(-1300%);}
 +
.put-section-14{ transform:translateY(-1400%);-webkit-transform:translateY(-1400%);}
 +
.put-section-15{ transform:translateY(-1500%);-webkit-transform:translateY(-1500%);}
 +
.put-section-16{ transform:translateY(-1600%);-webkit-transform:translateY(-1600%);}
 +
.put-section-17{ transform:translateY(-1700%);-webkit-transform:translateY(-1700%);}
 +
.put-section-18{ transform:translateY(-1800%);-webkit-transform:translateY(-1800%);}
 +
.put-section-19{ transform:translateY(-1900%);-webkit-transform:translateY(-1900%);}
 +
.put-section-20{ transform:translateY(-2000%);-webkit-transform:translateY(-2000%);}
 +
.put-section-21{ transform:translateY(-2100%);-webkit-transform:translateY(-2100%);}
 +
.put-section-22{ transform:translateY(-2200%);-webkit-transform:translateY(-2200%);}
 +
.put-section-23{ transform:translateY(-2300%);-webkit-transform:translateY(-2300%);}
 +
.put-section-24{ transform:translateY(-2400%);-webkit-transform:translateY(-2400%);}
 +
.put-section-25{ transform:translateY(-2500%);-webkit-transform:translateY(-2500%);}
 +
.put-section-26{ transform:translateY(-2600%);-webkit-transform:translateY(-2600%);}
 +
.put-section-27{ transform:translateY(-2700%);-webkit-transform:translateY(-2700%);}
 +
.put-section-28{ transform:translateY(-2800%);-webkit-transform:translateY(-2800%);}
 
.section-btn{ width:14px;position:fixed;right:1%;top:50%;}
 
.section-btn{ width:14px;position:fixed;right:1%;top:50%;}
 
.section-btn li{ width:14px;height:14px;cursor:pointer;text-indent:-9999px;border-radius:50%;-webkit-border-radius:50%;margin-bottom:12px; background:#BD362F;text-align:center; color:#fff; onsor:pointer;}
 
.section-btn li{ width:14px;height:14px;cursor:pointer;text-indent:-9999px;border-radius:50%;-webkit-border-radius:50%;margin-bottom:12px; background:#BD362F;text-align:center; color:#fff; onsor:pointer;}
Line 111: Line 136:
 
.closemenu{
 
.closemenu{
 
border:none;  
 
border:none;  
background:url(https://static.igem.org/mediawiki/2016/5/51/T--Jilin_China--web-s-bifi.png);  
+
background:url(https://static.igem.org/mediawiki/2016/d/d5/T--Jilin_China--mc-1.png) top right no-repeat;
 +
        background-size:50% 50%;
 
width:310px;  
 
width:310px;  
 
height:310px;  
 
height:310px;  
 
position:absolute;
 
position:absolute;
bottom:-100px;  
+
bottom:-140px;  
 
left:-160px;  
 
left:-160px;  
 
z-index:1000000;
 
z-index:1000000;
Line 122: Line 148:
 
.main > section input:hover {
 
.main > section input:hover {
 
border:none;
 
border:none;
background:url(https://static.igem.org/mediawiki/2016/8/80/T--Jilin_China--web-o-bifi.png);
+
background:url(https://static.igem.org/mediawiki/2016/8/80/T--Jilin_China--web-o-bifi.png) top right no-repeat;
 +
        background-size:50% 70%;
 +
bottom:-80px;
 
}
 
}
  
 
.main > section input.active {
 
.main > section input.active {
 
border:none;
 
border:none;
background:url(https://static.igem.org/mediawiki/2016/8/80/T--Jilin_China--web-o-bifi.png);
+
background:url(https://static.igem.org/mediawiki/2016/8/80/T--Jilin_China--web-o-bifi.png) top right no-repeat;
 +
        background-size:50% 70%;
 +
bottom:-80px;
 
}
 
}
  
Line 175: Line 205:
 
<!------------------------------------------------整屏翻页------------------------------------------------------->
 
<!------------------------------------------------整屏翻页------------------------------------------------------->
 
<script>
 
<script>
function jump1(){document.getElementById("jp1").click();}
+
function jpj1(){document.getElementById("pj1").click();}
function jump2(){document.getElementById("jp2").click();return false;}
+
function jpj2(){document.getElementById("pj2").click();}
 
function jump3(){document.getElementById("jp3").click();}
 
function jump3(){document.getElementById("jp3").click();}
 +
function jmd1(){document.getElementById("md1").click();}
 +
function jmd15(){document.getElementById("md15").click();}
 +
function hpb(){document.getElementById("hpb").click();}
  
 
function Design(){
 
function Design(){
Line 191: Line 224:
 
           str = Request.Url.ToString().Substring(0, Request.Url.ToString().IndexOf("?"));
 
           str = Request.Url.ToString().Substring(0, Request.Url.ToString().IndexOf("?"));
  
                     }
+
                     }alert(str);
 
       if(str==url){
 
       if(str==url){
 
           jump2();
 
           jump2();
 +
         
 +
         
 
       }  
 
       }  
      alert(str);
 
      return false;
 
 
       }
 
       }
  
Line 208: Line 241:
 
<ul id="s1">
 
<ul id="s1">
 
<li><a href="https://2016.igem.org/Team:Jilin_China">Home</a>
 
<li><a href="https://2016.igem.org/Team:Jilin_China">Home</a>
<li><a href="https://2016.igem.org/Team:Jilin_China/Description">Project</a>
+
<li><a href="https://2016.igem.org/Team:Jilin_China/Project">Project</a>
 
             <ul>
 
             <ul>
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Description?openId=jp1" >Background</a></li>
+
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Project?openId=pj1" onClick="jpj1(); return false;">Background</a></li>
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Description?openId=jp3" onClick="jump2()" >Design</a></li>
+
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Project?openId=pj2" onClick="jpj2(); return false;" >Design</a></li>
 
                  
 
                  
 
                 </ul>
 
                 </ul>
Line 218: Line 251:
 
                         <li><a href="https://2016.igem.org/Team:Jilin_China/Model">Model</a>
 
                         <li><a href="https://2016.igem.org/Team:Jilin_China/Model">Model</a>
 
             <ul>
 
             <ul>
                 <li><a href="#">Our Model</a></li>
+
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Model?openId=md1" onClick="jmd1(); return false;" >Our Model</a></li>
                 <li><a href="#">For Others</a></li>
+
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Model?openId=md15" onClick="jmd15(); return false;">For Others</a></li>
 
                  
 
                  
 
                 </ul>
 
                 </ul>
 
                         </li>
 
                         </li>
  
<li><a href="#">Experiments</a>
+
<li><a href="javascript:;">Experiments</a>
 
             <ul>
 
             <ul>
<li><a href="https://2016.igem.org/Team:Example/Notebook">Notebook</a></li>
+
                <li><a href="https://2016.igem.org/Team:Jilin_China/Protocol">Protocol</a></li>
 +
<li><a href="https://2016.igem.org/Team:Jilin_China/Notebook">Notebook</a></li>
 
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Interlab">Interlab</a></li>
 
                 <li><a href="https://2016.igem.org/Team:Jilin_China/Interlab">Interlab</a></li>
  
Line 240: Line 274:
 
             </li>
 
             </li>
 
 
<li><a href=" https://2016.igem.org/Team:Jilin_China/Parts">Parts</a></li>
+
<li><a href=" https://2016.igem.org/Team:Jilin_China/Parts">Parts</a>
 +
            <ul>
 +
<li><a href="https://2016.igem.org/Team:Jilin_China/Basic_Part">Basic Part</a></li>
 +
                <li><a href="https://2016.igem.org/Team:Jilin_China/Composite_Part">Composite Part</a></li>
 +
            </ul>             
 +
          </li>
  
                         <li><a href="https://2016.igem.org/Team:Jilin_China/Improvements">Improvements</a></li>
+
                         <li><a href="https://2016.igem.org/Team:Jilin_China/Description">Improvements</a></li>
  
  
Line 288: Line 327:
  
 
};
 
};
function preventBodyScroll(event){
+
var event = event.originalEvent || event;
+
if (event.wheelDelta < 0 || event.detail > 0) { // 向下滚动
+
if (this.scrollTop + this.clientHeight < this.scrollHeight) { // 未滚动到底
+
event.stopPropagation(); // 阻止事件继续冒泡
+
}
+
}
+
else { // 向上滚动
+
if (this.scrollTop > 0) { // 未滚动到顶
+
event.stopPropagation(); // 阻止事件继续冒泡
+
}
+
}
+
}
+
 
+
// document.getElementById('c1').addEventListener('mousewheel', preventBodyScroll, true);
+
// document.getElementById('c1').addEventListener('DOMMouseScroll', preventBodyScroll, true);
+
$('#c1').on('mousewheel DOMMouseScroll', preventBodyScroll);
+
 
+
 
           </script>
 
           </script>
 
</div>
 
</div>

Latest revision as of 06:10, 23 January 2017

Particles