1. Home
  2. Computing & Technology
  3. Animation

Creating Transparent Flash Movies with WMode and Div Layers

By , About.com Guide

1 of 4

So you’ve seen the ads – the ones that crop up wherever they please, swirl all over the page as if they aren’t even a part of the web page that you’re visiting, and then confine themselves to a nice, comfortably unobtrusive area once they’ve finished getting your attention. They’re increasingly popular these days, and if you know much about animation, then you can probably tell that they’re done in Flash. But considering that these ads obviously don’t have any background other than the web page itself, while Flash doesn’t allow transparent document backgrounds…you may have been a bit confused as to how this was accomplished.

The answer is a little snippet of HTML called wmode, and something known as a div layer. Rather than working with these in Flash, you’ll instead edit the raw HTML code. The wmode tag controls the transparency of Flash objects, while div layers let you position things with more freedom than the standard constraints of paragraph tags and tables.

So whip up a Flash file that you’d like to layer transparently, publish it to an HTML file, and let’s take a look at the source code. I’ve just created a simple little animation using a motion tween and a motion guide.

Explore Animation
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Animation
  4. Flash Animation Tutorials
  5. Creating Transparent Flash Movies with WMode and Div Layers

©2009 About.com, a part of The New York Times Company.

All rights reserved.