Embed Flash Movie to Overlapping Div Layers Float on Bottom
This HTML css div layer tutorial is same as the previous tutorial. The only difference is that the flash movie is embed on a div layer that float on the bottom stack.
Transparent Flash Movie Embed on Top Div Layer
We also use swfobject to embed the flash movie to div layer "layer 1". Please check the source codes of this HTML web page.
In order that the area of div layer "layer 1" can be seen, a thin black border is added to "layer 1".
CSS Div Layers Codes
#outerWrap {
position: relative;
z-index: 0;
background-color: #00CCFF;
height: 500px;
width: 650px;
}
#layer1 {
position: absolute;
z-index: 2;
background-color: #6F0;
height: 384px;
width: 512px;
top: 40px;
left: 40px;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
}
#layer2 {
position: absolute;
z-index: 3;
height: 220px;
width: 340px;
top: 259px;
left: 299px;
background-color: #FC0;
}
HTML CSS Tutorial contents: How to embed flash movie on div layer overlapped on bottom.
