Featured Content Slider

[primortal]

1) Script Title:
Featured Content Slider

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

3) Describe problem:
If I add a css for position like (position: relative), the fade between each 'tab' stops working. Somthing like this

<div id="slider1" class="contentslide">
<div class="opacitylayer">

<div class="contentdiv">
<div id="divContainer_1" style="overflow: hidden; position: relative; width: 100%; height: 100%; min-height: 160px;">
<div id="divContent_1" style="padding: 5px; position: absolute;">
Content 1
</div>
</div>
</div>

<div class="contentdiv">
<div id="divContainer_1" style="overflow: hidden; position: relative; width: 100%; height: 100%; min-height: 160px;">
<div id="divContent_1" style="padding: 5px; position: absolute;">
Content 2
</div>
</div>
</div>

</div>
</div>

<div class="pagination" id="paginate-slider1"></div>

<script type="text/javascript">
//Define: ContentSlider("slider_ID", [autorotate_miliseconds], [custompaginatelinkstext], [customnextlinktext])
ContentSlider("slider1")

</script>

[ddadmin]

Are you sure it's the position:relative declaration that's disabling the fade effect? Using the default example HTML, adding that in doesn't break the fade effect:


<div id="slider1" class="contentslide">
<div class="opacitylayer">

<div class="contentdiv" style="overflow: hidden; position: relative;">
Content 1
</div>

<div class="contentdiv" style="overflow: hidden; position: relative;">
Content 2
</div>

<div class="contentdiv" style="overflow: hidden; position: relative;">
Content 3
</div>

</div>
</div>

[primortal]

For me it broke the effect. I redesigned the content with out any positioning which seems to be working fine now.