Hello all,

I have a page with an accordion script to change out some description <div>'s
HTML Code:
<script type="text/javascript"><!--
var acc = new Accordion($$('.desc'), $$('.desc'),  {start:'all-close',transition: Fx.Transitions.quadOut});
acc.showThisHideOpen(0);
// --></script>
Here is the menu that calls the script:
HTML Code:
<div id="submenu">
<h3 class="sub">Treatments</h3>
<div><strong>Packages</strong> 
<a href="javascript:;" onclick="acc.showThisHideOpen(0);">5 in 1 Reconstructor </a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(1);">Fibergard</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(2);">Inner</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(3);">Curlisto Deep Therapy Masque</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(4);">Anti-Frizz Treatment </a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(5);">Prizms (gloss)</a> 
<br /> <strong>System Professional Treatments</strong> 
<a href="javascript:;" onclick="acc.showThisHideOpen(6);">Hydro Mask</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(7);">Power Mask</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(8);">Keratin Oil treatment</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(9);">Sensitive Mask</a> 
<a href="javascript:;" onclick="acc.showThisHideOpen(10);">Requlate</a></div>
</div>
Now the tricky part. I have a banner image on my page that I want to replace or over lap when the "Curlisto..." link is pressed.

my page has this div for the header image:
HTML Code:
<div class="header_photo"><img src="banner1.jpg" /></div>
and I tried adding this same div with the new image to the accordion div like so:
HTML Code:
<div class="desc">
<div class="header_photo"><img src="banner2.jpg" style="z-index:20;" /></div>
<h4>Curlisto Deep Therapy Masque</h4>...
I played around with css and absolute positions/z-index till I was blue in the face - I also tried changing the class of the second "header_photo" div to overlay the first - but nothing I do would bring the banner2.jpg image to the front.

So I thought I could use javascript to hide the header1.jpg when the "Curlisto..." link is clicked. Any thoughts on how to do this???

Thanks,