How to open popup in xul with transition

Question

I have a panel that opens when the user clicks the toolbar button,In order to open it I am using the openPopup method.
I want to openPopup with some effects,I don`t know - fade in,fade out,easing,how can I do this?

Answer 1

You can change panel opacity as you like. Some code to indicate how that might work (untested):

var panel = ...;
fadeIn(panel);
panel.openPopup(...);

function fadeIn(element)
{
  var step = -1;
  var maxStep = 10;
  function doStep()
  {
    step++;
    element.style.opacity = step / maxStep;
    if (step < maxStep)
      setTimeout(doStep, 100);
  }
  doStep();
}

There is an issue however: panel transparency isn't supported for all Linux distributions. For some distributions you will get a black rectangle instead of the panel if opacity is less than 1. Windows and OS X work correctly however.