如何让ext菜单收缩起来？？

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="<%=basePath%>ext/resources/css/ext-all.css" />
    <script type="text/javascript" src="<%=basePath%>ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="<%=basePath%>ext/ext-all.js"></script>
    <script type="text/javascript" src="<%=basePath%>ext/samples.js"></script>
  </head> <script type="text/javascript">
      Ext.onReady(function(){
           var menu1=new Ext.menu.Menu
           (
                  { items:[{                //菜单项的集合
                        text:"百 度",       //菜单项的文本，
                        href:"http://www.baidu.com",//指定链接地址
                        hrefTarget:"_blank",        //链接打开的发式，在新窗口打开
                        icon:"icon-info.gif"        //菜单项前面的图标
                    },
                    { text:"菜 单",
                        href:"http://jaychaoqun.cnblogs.cn",
                        hrefTarget:"_blank",
                        icon:"icon-info.gif"
                    },
                    {
                        text:"菜 单",
                        href:"http://jaychaoqun.cnblogs.cn",
                        hrefTarget:"_blank",
                        icon:"icon-info.gif"
                    }]
                    });
               var menu2=new Ext.menu.Menu
               (
           { items:[{                //菜单项的集合
                        text:"Google",       //菜单项的文本，
                        href:"http://www.google.cn",//指定链接地址
                        hrefTarget:"_blank",        //链接打开的发式，在新窗口打开
                        icon:"icon-info.gif"        //菜单项前面的图标
                    },
                    { text:"菜 单",
                        href:"http://jaychaoqun.cnblogs.cn",
                        hrefTarget:"_blank",
                        icon:"icon-info.gif"
                    },{
                        text:"菜 单",
                        href:"http://jaychaoqun.cnblogs.cn",
                        hrefTarget:"_blank",
                        icon:"icon-info.gif"
                    }]
                    });
         
            
                 var a=Ext.get("m1");
     if(a!=null)
    {
                a.on("mouseover",function(e){menu1.show(a);});
              }
              var b=Ext.get("m2");
              if(b!=null)
    {
 b.on("mouseover",function(e){menu2.show(b);});
             }
     
          });       
 </script>
 
<body>
<table bgcolor="#3399FF" align="center" width="800" height="69" border="0" cellpadding="0" cellspacing="0" >
 <tr>
      <td width="200"><div id="m1" >显示菜单</div></td>
      <td width="200"><div id="m2" >普通菜单</div></td>
      <td width="200"><div id="m3" >菜    单</div></td>
      <td width="200"><div id="m4" >菜    单</div></td>
  </tr>
</table>
       
        
    
</body>
</html>
**********************以上是我的jsp 用的是ext2.2，单鼠标移动到div上时菜单会显示， 如果不点击鼠标菜单是不会收缩的，问各位怎么样能让菜单自动收缩起来？？？

解决方案 »

  1.   


    <script type="text/javascript"> 
    var menu1;
          Ext.onReady(function(){ 
              menu1=new Ext.menu.Menu 
              ( 
                      { items:[{                //菜单项的集合 
                            text:"百 度",      //菜单项的文本， 
                            href:"http://www.baidu.com",//指定链接地址 
                            hrefTarget:"_blank",        //链接打开的发式，在新窗口打开 
                            icon:"icon-info.gif"        //菜单项前面的图标 
                        }, 
                        { text:"菜 单", 
                            href:"http://jaychaoqun.cnblogs.cn", 
                            hrefTarget:"_blank", 
                            icon:"icon-info.gif" 
                        }, 
                        { 
                            text:"菜 单", 
                            href:"http://jaychaoqun.cnblogs.cn", 
                            hrefTarget:"_blank", 
                            icon:"icon-info.gif" 
                        }],
                        listeners:{mouseout:function(obj,e,itm){
                         if(!e.getRelatedTarget().contains(e.getTarget()) && !obj.getEl().contains(e.getRelatedTarget())) obj.hide();
                         else if(e.getRelatedTarget().contains(obj.getEl().dom)) obj.hide();
                        }}
                 }); 
                  var menu2=new Ext.menu.Menu 
                  ( 
              { items:[{                //菜单项的集合 
                            text:"Google",      //菜单项的文本， 
                            href:"http://www.google.cn",//指定链接地址 
                            hrefTarget:"_blank",        //链接打开的发式，在新窗口打开 
                            icon:"icon-info.gif"        //菜单项前面的图标 
                        }, 
                        { text:"菜 单", 
                            href:"http://jaychaoqun.cnblogs.cn", 
                            hrefTarget:"_blank", 
                            icon:"icon-info.gif" 
                        },{ 
                            text:"菜 单", 
                            href:"http://jaychaoqun.cnblogs.cn", 
                            hrefTarget:"_blank", 
                            icon:"icon-info.gif" 
                        }],
                        listeners:{mouseout:function(obj,e,itm){
                         if(!e.getRelatedTarget().contains(e.getTarget()) && !obj.getEl().contains(e.getRelatedTarget())) obj.hide();
                         else if(e.getRelatedTarget().contains(obj.getEl().dom)) obj.hide();
                        }}
                }); 
                var a=Ext.get("m1"); 
        if(a!=null) 
        { 
           a.on("mouseover",function(e){menu1.show(a);});
           a.on("mouseout",function(e){
              if(e.getRelatedTarget().contains(e.getTarget()) && !menu1.getEl().contains(e.getRelatedTarget())) menu1.hide();
           });
        } 
        var b=Ext.get("m2"); 
        if(b!=null) 
        { 
            b.on("mouseover",function(e){menu2.show(b);});
            b.on("mouseout",function(e){
              if(e.getRelatedTarget().contains(e.getTarget()) && !menu2.getEl().contains(e.getRelatedTarget())) menu1.hide();
            }); 
        } 
    });
    </script> <body> 
    <table bgcolor="#3399FF" align="center" width="800" height="69" border="0" cellpadding="0" cellspacing="0" > 
    <tr> 
          <td width="200"> <div id="m1" >显示菜单 </div> </td> 
          <td width="200"> <div id="m2" >普通菜单 </div> </td> 
          <td width="200"> <div id="m3" >菜    单 </div> </td> 
          <td width="200"> <div id="m4" >菜    单 </div> </td> 
      </tr> 
    </table>