JS实现菜单样式

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
     < title > 测试 </ title >

     < script  language ="javascript"  type ="text/javascript" > ...

        //
        var divMaxH=200;
        var H=3;
        var timeOut=50;
        
        var fDTimeOutVar;
        var zXTimeOutVar;        
        
        //$是变量名
        var $ = document.getElementById;
        function isIn(e)
        ...{

            var o1 = $("TestTd1"), o2 = $("TestDiv1");
            //三元表达式
            var obj = typeof(event) != "undefined"? e.toElement:e.relatedTarget;

            var dn = false;
            if(obj != null)
            ...{
                //do while
                do
                ...{
                    if(obj == o1 || obj == o2)...{dn = true;break;}
                }
                while((obj = obj.parentNode) != null)
            }
            return dn
        }
        
        //鼠标进入
        function MouseOver(e)
        ...{        
            window.clearTimeout(zXTimeOutVar);
            
            if(isIn(e))
                DivFD();            
        }
        
        //鼠标离开
        function MouseOut(e)        
        ...{            
            window.clearTimeout(fDTimeOutVar);
            
            if(!isIn(e))
                DivZX();
        }    
        
        //Div放大
        function DivFD()        
        ...{        
            var divH=parseInt(TestDiv1.style.height,10);
            
            if(divH<divMaxH)
            ...{
                TestDiv1.style.height=divH+Math.ceil((divMaxH-divH)/H);
                
                fDTimeOutVar=setTimeout("DivFD()",timeOut);
            }
        }
        
        //Div缩小
        function DivZX(obj)
        ...{            
            var divH=parseInt(TestDiv1.style.height,10);
            
            if(divH>0)
            ...{
                TestDiv1.style.height=divH-Math.ceil(divH/H);
                
                zXTimeOutVar=setTimeout("DivZX()",timeOut);
            }
        }

     </ script >

</ head >
< body >
     < table >
         < tr >
             < td  id ="TestTd1"  style ="width: 100px; height: 21px; background-color: #ffff33;"  onmouseover ="MouseOver(event)"  onmouseout ="MouseOut(event)" >
                Test1
             </ td >         
         </ tr >
     </ table >
     < div  id ="TestDiv1"  style ="left: 10px; width: 101px; position: absolute; top: 37px;height: 0px; background-color: #ff3300;"  onmouseover ="MouseOver(event)"  onmouseout ="MouseOut(event)" >
     </ div >     
</ body >
</ html >