|
|
| Line 2: |
Line 2: |
| | <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> | | <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> |
| | <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> | | <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> |
| - | | + | <script src="https://2013.igem.org/Team:WHU-China/menujs?action=raw&ctype=text/javascript"></script> |
| | <style type="text/css"> | | <style type="text/css"> |
| | html,body{font-family:Tahoma, Geneva, sans-serif;height:100%;} | | html,body{font-family:Tahoma, Geneva, sans-serif;height:100%;} |
| Line 70: |
Line 70: |
| | @-moz-document url-prefix(){.iframe_gd{margin-top:-5px;}} | | @-moz-document url-prefix(){.iframe_gd{margin-top:-5px;}} |
| | </style> | | </style> |
| - | <script type="text/javascript">
| |
| - | $(function(){
| |
| - | //event configs
| |
| - | var menuEvents={timeoutId:0,timeId2:null,mouseover:false,haschild:false,currentLiTarget:null};
| |
| - | //(sub menu's)containter element
| |
| - | var container=document.getElementById('menu-sub-container');
| |
| - | //event proxy : the child nodes of the container element are changes all the time
| |
| - | // so that i bind the event on the (sub menu's)container element
| |
| - | container.onmouseover=function(e){
| |
| - | var even=e||window.event;
| |
| - | var target=even.srcElement||even.target;
| |
| - | while(target && target.id!="menu-sub-container" && target.tagName.toLowerCase()!="body"){
| |
| - | //find son element of the (sub menu's)container
| |
| - | if(target.parentNode.className.indexOf("menu-sub-list-row")!=-1){
| |
| - | //contrast with the last target that we saved
| |
| - | if(target!=menuEvents.currentLiTarget){
| |
| - | menuEvents.currentLiTarget=target;
| |
| - | $('#menu-sub-container .hover').removeClass('hover');
| |
| - | $(target).addClass('hover');
| |
| - | }
| |
| - | break;
| |
| - | }
| |
| - | target=target.parentNode;
| |
| - | }
| |
| - | };
| |
| - | //events about level1 menus
| |
| - | $('.toplist').hover(function(e){
| |
| - | menuEvents.mouseover=true;
| |
| - | var that=this;
| |
| - | //has child
| |
| - | if($('.sec',that).length>0){
| |
| - | clearTimeout(menuEvents.timeoutId);
| |
| - | menuEvents.timeoutId=null;
| |
| - | menuEvents.haschild=true;
| |
| - | //no child
| |
| - | }else{
| |
| - | menuEvents.haschild=false;
| |
| - | }
| |
| - | //set a delay to show sub menus
| |
| - | menuEvents.timeoutId2=setTimeout(function(){
| |
| - | if(menuEvents.mouseover==true&&$('.sec',that).length>0){
| |
| - | document.getElementById('menu-sub-container-inner').innerHTML=$('.sec',that)[0].innerHTML;
| |
| - | $('#menu-sub-container').animate({height:$('#menu-sub-container-inner').height()+10},400);
| |
| - | }
| |
| - | },150);
| |
| - | },function(e){
| |
| - | menuEvents.mouseover=false;
| |
| - | clearTimeout(menuEvents.timeoutId2);
| |
| - | menuEvents.timeoutId2=null;
| |
| - | //set a delay to hide sub menus
| |
| - | menuEvents.timeoutId=setTimeout(function(){
| |
| - | if(menuEvents.haschild===false || menuEvents.mouseover===false){
| |
| - | $('#menu-sub-container').animate({height:0},400);
| |
| - | }
| |
| - | },300);
| |
| - | });
| |
| - | $('.topla').hover(function(){
| |
| - | $(this).addClass('hover');
| |
| - | },function(){
| |
| - | $(this).removeClass('hover');
| |
| - | })/*.click(function(){
| |
| - | $(this).removeClass('hover');
| |
| - | });*/
| |
| - | //events about (sub menu's)container
| |
| - | $('#menu-sub-container').hover(function(e){
| |
| - | clearTimeout(menuEvents.timeoutId);
| |
| - | menuEvents.timeoutId=null;
| |
| - | },function(e){
| |
| - | menuEvents.timeoutId=setTimeout(function(){
| |
| - | $('#menu-sub-container').animate({height:0},400);
| |
| - | },300);
| |
| - | });
| |
| - | });
| |
| | | | |
| - | </script>
| |
| | <div id="header"> | | <div id="header"> |
| | <div id="header-inner"> | | <div id="header-inner"> |
"
