Difference between revisions of "Team:NUDT CHINA"
| Line 18: | Line 18: | ||
var iContentHeight = 0; | var iContentHeight = 0; | ||
contentAuto(); | contentAuto(); | ||
| + | mouseWheel(); | ||
bindNav(); | bindNav(); | ||
add1(); | add1(); | ||
| Line 25: | Line 26: | ||
showLoading(); | showLoading(); | ||
}; | }; | ||
| + | } | ||
| + | function mouseWheel(){ | ||
| + | var bBtn = true; | ||
| + | var timer = null; | ||
| + | if(oContent.addEventListener){ | ||
| + | oContent.addEventListener('DOMMouseScroll',function(ev){ | ||
| + | var ev = ev || window.event; | ||
| + | clearTimeout(timer); | ||
| + | timer = setTimeout(function(){ | ||
| + | toChange(ev); | ||
| + | },200); | ||
| + | },false); | ||
| + | } | ||
| + | oContent.onmousewheel = function(ev){ | ||
| + | var ev = ev || window.event; | ||
| + | clearTimeout(timer); | ||
| + | timer = setTimeout(function(){ | ||
| + | toChange(ev); | ||
| + | },200); | ||
| + | }; | ||
| + | |||
| + | function toChange(ev){ | ||
| + | if(ev.detail){ | ||
| + | bBtn = ev.detail > 0 ? true : false; | ||
| + | } | ||
| + | else{ | ||
| + | bBtn = ev.wheelDelta < 0 ? true : false; | ||
| + | } | ||
| + | |||
| + | if( iNow == aLiList.length-1){if(bBtn!=0){return;};} | ||
| + | if( iNow == 0 ){if(bBtn==0){return;};} | ||
| + | |||
| + | prevIndex = iNow; | ||
| + | if(bBtn){ //↓ | ||
| + | if(iNow != aLiList.length-1){ | ||
| + | iNow++; | ||
| + | } | ||
| + | toMove(iNow); | ||
| + | } | ||
| + | else{ //↑ | ||
| + | if(iNow != 0){ | ||
| + | iNow--; | ||
| + | } | ||
| + | toMove(iNow); | ||
| + | } | ||
| + | |||
| + | if(ev.preventDefault){ | ||
| + | ev.preventDefault(); | ||
| + | } | ||
| + | else{ | ||
| + | return false; | ||
| + | } | ||
| + | } | ||
| + | |||
} | } | ||
function showLoading(){ | function showLoading(){ | ||
| Line 104: | Line 159: | ||
</script> | </script> | ||
<style type="text/css"> | <style type="text/css"> | ||
| − | . | + | .myheader{height: 100%; align-content: center center; background-color: rgba(255,255,255,0.3);} |
| − | + | ||
| − | + | ||
.content{width:100%;} | .content{width:100%;} | ||
li{ list-style:none;} | li{ list-style:none;} | ||
| Line 113: | Line 166: | ||
#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;} | ||
| − | + | .myheader img{width:100%;} | |
| − | + | ||
| − | .myheader img{ | + | |
#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;} | ||
| Line 237: | Line 288: | ||
</div> | </div> | ||
</div> | </div> | ||
| − | <div id="content" class="content"> | + | <div id="content" class="content"id="main"> |
<ul id="lay-menu"> | <ul id="lay-menu"> | ||
<li class="active"></li> | <li class="active"></li> | ||
| Line 247: | Line 298: | ||
<ul id="Qidilist"> | <ul id="Qidilist"> | ||
<li id="abstract" class="liList"> | <li id="abstract" class="liList"> | ||
| − | <div class="myheader | + | <div class="myheader"><img class="strory-telling1" src="https://static.igem.org/mediawiki/2017/a/ad/T-NUDT_CHINA-story1.png"width=70%, no-repeat; ></div> |
</li> | </li> | ||
<li id="abstract" class="liList"> | <li id="abstract" class="liList"> | ||
Revision as of 08:47, 25 October 2017
