Changes

Jump to: navigation, search

JavaScript and CSS - Dynamic Styles and Layers

516 bytes added, 19:07, 17 May 2007
Using overlying Layers
In this example we will look at the <nowiki><div></nowiki> tag but the concepts are the same for <nowiki><iframe></nowiki>.
 
First we need to create our layers and set up some styles so that they are positioned and distinguished by colors:
 
<pre>
 
<style type="text/css">
 
#layer1 {
background-color: yellow;
height:90px;
width:90px;
left:0px;
top:0px;
}
 
#layer2 {
background-color: red;
height:90px;
width:90px;
left:0px;
top:0px;
}
 
#layer3 {
background-color: blue;
height:90px;
width:90px;
left:0px;
top:0px;
}
 
</style>
 
<p id="layer1">This is layer 1</p>
<p id="layer2">This is layer 2</p>
<p id="layer3">This is layer 3</p>
 
</pre>

Navigation menu