1) Script Title: Featured Content Slider v2.4
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tentslider.htm
3) Describe problem:
Hello,
I need one slider with three paginate-slider: one with images, one with text-links and one for 'prev' and 'next'. I have spent a lot of time, but I didn´t find a solution. Is this possible?
Thanks in advance!
beathead
Hmm I don't see an easy way to modify the script for this unfortunately- that is, have the script recognize and parse more than one pagination DIV to be associated with a Featured Content instance. You can, however, manually get to where you want in a way by defining arbitrary links anywhere on the page that jumps to specific slides. For example, you may have arbitrary text links that jump to a particular slide within a particular featured content slider using the functionfeaturedcontentslider.jumpTo("sliderID", pagenumber):
There's no way to do the same for the "prev" and "next" functions though.Code:<a href="javascript:featuredcontentslider.jumpTo('mysliderid', 0)">Page 1</a> | <a href="javascript:featuredcontentslider.jumpTo('mysliderid', 1)">Page 2</a> | <a href="javascript:featuredcontentslider.jumpTo('mysliderid', 2)">Page 3</a>
Re:Hmm ;)
Yes, I made this yesterday, but then the 'a.selected' doesn´t work.
I try it with the 'onChange event handler', but... :(
Any idea?Code:<div id="paginate-slider-2" class="pagination">
<a href="javascript:featuredcontentslider.jumpTo('slider', 1)" class="toc"><img src="images/projekte/projekt-1_0.jpg" /></a>
<a href="javascript:featuredcontentslider.jumpTo('slider', 2)" class="toc"><img src="images/projekte/projekt-2_0.jpg" /></a>
<a href="javascript:featuredcontentslider.jumpTo('slider', 3)" class="toc"><img src="images/projekte/projekt-3_0.jpg" /></a>
</div>
<div id="paginate-slider-3" class="pagination">
<a href="javascript:featuredcontentslider.jumpTo('slider', 1)" class="toc">1</a><br />
<a href="javascript:featuredcontentslider.jumpTo('slider', 2)" class="toc">2</a><br />
<a href="javascript:featuredcontentslider.jumpTo('slider', 3)" class="toc">3</a><br />
</div>
<div id="mainContent">
<!--Inner content DIVs should always carry "contentdiv" CSS class-->
<!--Pagination DIV should always carry "paginate-SLIDERID" CSS class-->
<div id="slider" class="sliderwrapper">
<div class="contentdiv">
Content 1 Here.
</div>
<div class="contentdiv">
Content 2 Here. <br />
</div>
<div class="contentdiv">
Content 3 Here.
</div>
</div>
<div id="paginate-slider" class="pagination">
<a href="#" class="prev"><</a>
<a href="#" class="next">></a>
</div>
<script type="text/javascript">
featuredcontentslider.init({
id: "slider", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "markup", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["Zurück", "Weiter"], //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: [false, 3000], //[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>
</div>
ThanX
beathead
The ".selected" link won't work in those links you manually created unfortunately. That's part of what I meant by "there's no easy way to modify the script for this", as that's one of the features that's more complex to add if you have multiple pagination DIVs on the page.
Do you know another script with this features?