PDA

View Full Version : Content Slider Pagination Image Issues



eslaydon
05-01-2009, 08:31 PM
1) Script Title: Content Slider v 2.4

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

3) Describe problem: I want to use a 20 x 20 px circular background image on the pagination links. I've got it working fine in FireFox but IE7 refuses to make the entire background image display - it keeps cutting it off at the top/bottom. Any suggestions?

CSS of code in question:


.sliderwrapper{width:384px; height:199px; margin-left:38px; position:relative; overflow:hidden;}
.sliderwrapper .contentdiv{visibility:hidden; position:absolute; left:0; top:0; width:364px; padding:10px; height:100%; filter:progid:DXImageTransform.Microsoft.alpha(opacity=100); -moz-opacity: 1;
opacity:1;}
.pagination{width:364px; text-align:left; margin:0; padding:0; height:20px;}
.pagination a{margin:0; text-decoration:none; background: url("/images/home/numberBGOff.gif") no-repeat; padding:2px 5px 10px 5px; color:#ffffff; height:20px;}
.pagination a:hover, .pagination a.selected{background: url("/images/home/numberBGOn.gif") no-repeat;}


Code:


<div id="slider1" class="sliderwrapper">

<div class="contentdiv">content</div>
<div class="contentdiv">content</div>
<div class="contentdiv">content</div>

</div>

<div class="pagination" id="paginate-slider1"></div>
<script type="text/javascript">
featuredcontentslider.init({
id: "slider1", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["&lt;", "&gt;"], //labels for "prev" and "next" links. Set to "" to hide.
revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
enablefade: [true, 0.2], //[true/false, fadedegree]
autorotate: [true, 2500], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script>