title: How to temporary expand collapsed panel on mouse over title bar in extjs?
body: <p>I have a border layout with two panels inside center and west regions. By default, west panel is collapsed and if you click on any part of the title bar while is collapsed, the panel is temporary expanded until you move the mouse pointer out of its boundaries. </p>
  
  <p>What I want to do is to have this same "temporary expand" not by clicking on the panel's title bar, but just hovering over it. How can I make that possible?</p>
  
  <p>Here is my code:</p>
  
  <pre><code>Ext.onReady(function() {
      Ext.create('Ext.window.Window', {
          width: 500,
          height: 300,
  
          layout: 'border',
  
          items: [{
                  xtype: 'panel',
                  title: 'Center Panel',
                  region: 'center',
                  flex: 1
              },{
                  xtype: 'panel',
                  title: 'West Panel',
                  region: 'west',
                  flex: 1,
  
                  collapsible: true,
                  collapsed: true,
                  animCollapse: false,
                  collapseDirection: Ext.Component.DIRECTION_BOTTOM,
                  titleCollapse: true
          }]
      }).show();
  });
  </code></pre>
  
  <p>Please refer to the following fiddle for your convenience: <a href="http://jsfiddle.net/3FJ58/3/" rel="nofollow">http://jsfiddle.net/3FJ58/3/</a></p>
  
  <p>Thanks in advance!</p>