wmode - What does it mean in browser's rendering behavior?

Question

Wmode in object tags and iframe tags.

There are many discussions on making navigation to work properly in flash pages etc etc.

- Someone please explain with details on what attribute does in actual. Any level of technical details is accepted.

Thank you

Answer 1

wmode is a parameter exclusive to <embed> tag referring to Flash movies. The default value is wmode=window.

wmode=window

When wmode=window, the Flash movie is not rendered in the page. It is instead displayed in a separate window than the browser content (as inspected with Spy++ or WinSpy++). This mode will have the best performance as the browser does not have to redraw a portion of the page on each frame. However, this mode prevents you from having content appear above or below the Flash movie.

• Best Performance
• Rendered in separate window
• Opaque background
• Doesn't allow content below
• Doesn't allow content above

wmode=opaque

When wmode=opaque, the Flash movie is rendered as part of the page. No window is created for the movie. The movie will be rendered with the background color set during the publishing process and no content will be allowed behind. On each frame, content which appear above the movie will have to be redrawn by the browser, thus affecting performance.

• Good Performance
• Rendered as part of the page
• Opaque background
• Doesn't allow content below
• Allows content above

wmode=transparent

When wmode=transparent, the Flash movie is rendered as part of the page. No window is created for the movie. The background color of the movie will be transparent. Thus, any non-opaque section of the movie will allow underlying content to display. On each frame, content which appear above and below the movie will have to be redrawn by the browser, thus greatly affecting performance.

• Fair Performance
• Rendered as part of the page
• Transparent background
• Allows content below
• Allows content above

---

EDIT : Here are the answers to your additional questions...

Is wmode a FLASH only attribute?
Yes, wmode is only available in <embed> tags embedding a Flash movie.

What are the impacts on performance between the different values?
wmode=window will have the best performance as the Flash movie is rendered completely separately from the page itself. The browser does not have to refresh nor calculate the z-index position of content appearing over the Flash movie since the Flash movie in this mode is rendered in a completely separate window (as can be inspected with Spy++).

wmode=opaque and mode=transparent both follow very similar rendering paths. They are however slower than wmode=window because the browser has to check elements to see if they render above than the movie and render them on each frame. Note that wmode=transparent is slower than wmode=opaque since it has to also render underlying content as well as superposing content.

So, in order of performance...

FASTEST ----------------------------- SLOWEST

WINDOW             OPAQUE         TRANSPARENT