function csOnMouseEnter(aEvent, aTarget, aOptions)
  {
  var mask = Ext.fly(aTarget);
  mask.fadeOut(
    {
    endOpacity: 0,
    easing: 'easeOut',
    duration: .15,
    stopFx: true,
    useDisplay: true
    });
  }

function csOnMouseLeave(aEvent, aTarget, aOptions)
  {
  var mask = Ext.fly(aTarget);
  if (mask.hasClass('sHoverMask') !== true)
    {
    var p = mask;
    while (p.select('.sHoverMask').getCount() == 0)
      p = p.parent();
    mask = p.child('div.sHoverMask');
    }

  mask.fadeIn(
    {
    endOpacity: .6,
    easing: 'easeOut',
    duration: .25,
    stopFx: true,
    useDisplay: true
    });
  }

Ext.onReady(function()
  {
  var masks = Ext.select('div.sHoverMask');

  masks.on('mouseenter', csOnMouseEnter, this);
  masks.each
    (
    function(aElement, aSender, aIndex)
      {
      var p = aElement.parent();
      p.on('mouseleave', csOnMouseLeave, this);
      }
    );
  });