Team:WHU-China/menujs
From 2013.igem.org
/*@Allen Zhou 20110818 */ /*this part copied from the http://www.geneetics.cn all rights reserved by 2013 BGI */ $(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},20); } },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},20); } },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); }); });