[jQuery] Cycle Plugin and z-index

[Matthew]

Hi,
I'm using M. Alsup's Cycle plugin to transition between a series of
images. This is working as expected, but I'm having problems getting
an additional image to appear "above" them, at a higher z-index. I've
tried giving both elements a fixed z-index, and by using a transparent
slide I'm able to verify that the overlay is being positioned
correctly, but it seems like something is interfering with the normal
z-index rules.

Any ideas?

HTML:
<div id="picwrapper">
  <img src="images/overlay.png" alt="" id="overlay" />
  <div id="pics">
    <div class="slide"><img src="images/slide1.jpg" width="920"
height="200" />
      <span class="slidetitle">Slide 1 caption</span>
    </div>
    <div class="slide"><img src="images/slide2.jpg" width="920"
height="200" />
      <span class="slidetitle">Slide 2 caption</span>
    </div>
  </div>
</div>

CSS:
#picwrapper{
  position: absolute;
  top: 47px;
}

#picwrapper #overlay{
  position: absolute;
  top: 5px;
  right: 10px;
  z-index: 1000;
}

#pics{
  z-index: 900;
}

JS:
<script type="text/javascript">
jQuery('#pics').cycle( { pause: 1, speed: 4000, timeout: 4000 } );
</script>

Thank you,

Matthew