Making JS Accordion play nice with opacity

[dzandman]

Hello world! I am basically a webdev beginner.

I was trying last night to update/revamp my site (dzandman.com), but I hit a bump. I'm trying to figure out how to make the text on each main label (About Me, My Work...) stay 100% opacity, while the bg color is reduced.

This guy (http://www.daniweb.com/forums/thread297491.html) got me close, but I can't figure out how to implement his CSS without breaking the JS. Any ideas?

As an example, this is how the second drawer is set up:


<h1 class="accordion_toggle">My Work</h1>
<div class="accordion_content">

<div id="vertical_nested_container" >

<h3 class="vertical_accordion_toggle">Advertising</h3>
<div class="vertical_accordion_content">

Thank you very much!

[Wickham]

Opacity or filter applies to all content in the same element, so the only way you can get text or an image with no opacity over a background that has opacity is to layer it, using a div or another element that isn't nested and it needs position: absolute or position: relative to reposition it over the element with opacity.

I've never tried that with an accordion menu.