home / documentation / reference / iehidetransition

IEHideTransition

Description:

The transition effect to be applied to menus when they are hidden.

Value:

String, null, or JavaScript expression that returns a string/null.

Applies To:

Menus.

Browser Compatibility:

IEHideTransition is supported only in Internet Explorer 5.5 and later.

Comments:

IEHideTransition should be applied as a string, which means the value you supply should always be in quotes.

Allowed values for IEHideTransition are dicated by Microsoft's own syntax, and, for the most part, mirror the syntax used when adding a transition effect to an element via a style sheet rule. The only exceptions to this rule are that the entire filter assigment must be enclosed in quotes (which means embedded, quoted parameters must use the alternate quotes), and that the leading filter: designation should not be included. So, for example, in a style sheet you might implement a gradient wipe transition filter like this:

filter:progid:DXImageTransform.Microsoft.GradientWipe(motion="reverse",duration=1)

But in HierMenus it would look like this:

IEHideTransition:"progid:DXImageTransform.Microsoft.GradientWipe(motion='reverse',duration=1)",

Each transition filter is defined by Microsoft to use its own set of parameters, with their own allowed values. A full explanation for each of these possibilities is beyond the scope of our HierMenus documentation. For complete syntax details, visit Microsoft's own documentation on the subject:

MSDN: Filters and Transitions

Only one filter may be supplied for IEHideTransition.

IEHideTransition is overriden by custom transition implementations (setTrans and killTrans). See the Custom Transitions mini-tutorial for further details.

The older Microsoft filter syntax (blendTrans(duration=1), for example) is not supported by HierMenus.

We strongly discourage the use of hide transitions. The additional visual distraction of filters for both the showing and hiding of menus can be very annoying to site visitors (the initial impression of transition effects wears off very quickly). In some cases, HierMenus may interrupt a transition effect (immediately displaying or hiding the menu, as appropriate) when necessary. For example, if a child menu of a particular menu is about to be displayed, but the show transition of a different sibling menu has yet to be completed, that sibling menu will be immediately shown in its fully visible state (the remainder of the show transition will be ignored) so that HierMenus can then hide the menu properly (at which time, the sibling's HideTransition, if one is specified, will be implemented).

One specific transition deserves special mention here. The Pixelate transition often doesn't work properly on the first display of a menu. The following code, which you can hook to the menu's HM_OnMenuCreated event, usually corrects this problem. Unfortunately, this code requires the existence of an IEHideTransition on the menu as well as an IEShowTransition:

function fixPixelate(menuEl) {
      if(!window.HM_IE55) return;
      var theFilter=menuEl.filters.item(this.HideTransitionIndex);
      theFilter.apply();
      theFilter.play();
}

See the sample pages for examples of live Internet Explorer menu transitions.

Examples:

// Ok:
IEHideTransition:"progid:DXImageTransform.Microsoft.Fade(duration=1)",
IEHideTransition:null,
IEHideTransition:(window.useFade)?
   "progid:DXImageTransform.Microsoft.Fade(duration=1)":null,
   // if the user defined variable "useFade" is set, 
   // apply fade transition filter

// Incorrect:
IEHideTransition:progid:DXImageTransform.Microsoft.Fade(duration=1),
   // outer quotes required
IEHideTransition:"progid:DXImageTransform.Microsoft.GradientWipe(motion="reverse")",
   // inner quotes ("reverse") should be 
   // opposite of outer ('reverse')
IEHideTransition:"filter:progid:DXImageTransform.Microsoft.GradientWipe(motion='reverse')",
   // do not include the word "filter:"
IEHideTransition:"null",     // quotes not allowed around null
IEHideTransition:'(window.useFade)?
   "progid:DXImageTransform.Microsoft.Fade(duration=1)":null', 
   // no quoted expressions

Default:

null

See Also:

IEFilters, IEShowTransition, setTrans, killTrans, Custom Transitions Mini-Tutorial