Question

Im using the jquery plugin jquery.cycle.all.js

basically i want to place a div menu on top of an image.
The menu is in the right place but cant be seen as the slider is on top of it.

Can anyone help me place the menu on top of the slider

Heres the code im using, any help will be appreciated.

 <div id= "MiddleContent">

             <div class="Menu">
                        <ul>
                            <li style="background-color:Red;">item</li>
                            <li style="background-color:blue;">item</li>
                            <li style="background-color:green;">item</li>
                            <li style="background-color:yellow;">item</li>
                            <li style="background-color:orange;">item</li>
                        </ul>
                    </div>

                <div class="slideshow">
                    <img src="images/Slider1.png"  alt="" />
                    <img src="images/Slider2.png"  alt="" />
                    <img src="images/Slider3.png"  alt="" />
                    <img src="images/Slider4.png"  alt="" />
                    <img src="images/Slider5.png"  alt="" />
                    <img src="images/Slider6.png"  alt="" />
                </div>
             </div>

Heres the css

  /************************************/
    /* #MiddleContent                   */
  /************************************/
     div#MiddleContent
 {

   position: relative;
    margin:                 50px 50px 50px 50px;



  }
  div#MiddleContent .slideshow
  {
        overflow: hidden;

float:                  left;
  margin:                 0px 0px 0px 0px;
  padding:                0px 0px 0px 0px;
  }
  div#MiddleContent  .Menu
  {
     position: absolute;
     left: 0px; right: 0; bottom: 0px;  top: 0px;
 min-height: 300px;
 max-width : 250px;
 background: white;
    z-index: 1000px;


    margin:                 0px 0px 0px 0px;
    padding:                0px 0px 0px 0px;
  } 

Answer 1

your main problem is z-index: 1000px; this shoul be z-index: 1000;

 div#MiddleContent  .Menu
  {
     position: absolute;
     left: 0px; right: 0; bottom: 0px;  top: 0px;
     min-height: 300px;
     max-width : 250px;
     z-index: 1000;
     margin:    0px 0px 0px 0px;
     padding:   0px 0px 0px 0px;
  }

also remove background so the menu become transparent