Text over a image slideshow - jQuery cycle2

Question

I'm using jquery cycle2 plugin for the slideshow. Now i'm facing a challenge. I'm able to make the slideshow with the use of that plugin but the thing is i want to write some text on top of the image and the text needs to appeared only for that particular image. But if I use make the slideshow div position relative and the text div position absolute using css nothing's happening.

Code HTML :

<div class="offset1 span12 cycle-slideshow">
    <img src="assets/img/1.jpg">
        <div id="text1">
            <strong>A</strong><span>lpha</span>
        </div>
    <img src="assets/img/2.jpg">
    <img src="assets/img/3.jpg">
</div>

Code CSS :

.cycle-slideshow {
position: relative; 
}
#text1 {
    position: absolute; 
    top: 200px; 
} 

Anyhelp will be very much pleased.

Answer 1

this may help u.if stil this not working means ur slide div may contain large z-index than ur text div

.cycle-slideshow {
position: relative; 
z-index:1;

}
#text1 {
    position: absolute; 
    top: 200px; 
    color:#fff;
    z-index:2;

} 

http://jsfiddle.net/TDSFF/

Answer 2

Follow the steps described in the documentation:

1. Add a div with the class .cycle-overlay inside the cycle slideshow
   • Add CSS rules
2. Add the data-cycle-title and data-cycle-desc attributes on the slides. Leave empty if necessary.

Demo here