Link to home
Start Free TrialLog in
Avatar of msal00
msal00

asked on

Merging or Blending DIV Layers

I have five div layers, both which show .png gradient files when selected. All of these layers contain links. When I select/show all the layers at the same time, the top layer becomes the only layer I can click on the links. Is there a way to either "merge" or "blend" the layers upon selection so that all the links work? Thanks! The CSS code follows:

#layer1,#layer2,#layer3,#layer4,#layer5 { position:absolute; display:none; border:none;}
#layer1 img, #layer2 img, #layer3 img, #layer4 img, #layer5 img { border:0; } 
 
#layer1 { background:url(../images/img1.png) no-repeat;}
#layer2 { background:url(../images/img2.png) no-repeat; }
#layer3 { background:url(../images/img3.png) no-repeat;}
#layer4 { background:url(../images/img4.png) no-repeat;}			
#layer5 { background:url(../images/img5.png) no-repeat; } 			
 
* html #layer1, * html #layer2, * html #layer3,* html #layer4,* html #layer5 { background-image:none; }
* html #layer1src { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/img1.png', sizingMethod='scale'); }
* html #layer2src { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/img2.png', sizingMethod='scale'); }
* html #layer3src { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/img3.png', sizingMethod='scale'); }
* html #layer4src { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/img4.png', sizingMethod='scale'); }
* html #layer5src { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/img5.png', sizingMethod='scale'); }

Open in new window

Avatar of Göran Andersson
Göran Andersson
Flag of Sweden image

If more than one link would be active for a certain region of the page, what would you like the result to be? How should the browser react when you active more than one link at once?
Avatar of msal00
msal00

ASKER

Each layer is an image has various areas that are image mapped. If I activate more than one layer at the same time, only the mapped links on the top most layer work. I am beginning to wonder I have to place all the links on one, invisible image map, and then dynamically call the links based on which layer is being shown.
Avatar of msal00

ASKER

Do you know how to go about dynamically activating links based on a selected link? For example, if I select a link, I want certain links to appear. If I select two links at the same time, I want different links to appear as well. Thanks.
ASKER CERTIFIED SOLUTION
Avatar of Göran Andersson
Göran Andersson
Flag of Sweden image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of msal00

ASKER

As I toggle through buttons, I wanted to turn the links on and off depending on the selected button. All the links are placed on an invisible layer and turned on and off depending on the selected button.
Avatar of msal00

ASKER

Thanks for your help.
Buttons are normally clicked, not toggled. Do you mean radio buttons?