View Full Version : How to Stop Slider from rotating on some other action

09-07-2011, 07:18 PM
1) Script Title: Feature Content Slider

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

3) Describe problem: I have feature content slider placed as given and works fine. I want to stop the slider from rotating onclick of other div. In other words, i have placed a tabslideout like this (http://www.building58.com/examples/tabSlideOut.html) in the same page where i have the feature slider.

So when i click to open this tabslider, i want to stop the content slider to stop rotating and resume when i close this tabslideout. Please let me know if it is possible and suggesitons to do it.

Thanks for your help.


09-08-2011, 02:44 AM
Sure, try the below modified contentslider.js file, which adds a new public method:

featuredcontentslider.playpause('sliderid', 'play|pause')

The first parameter of the method should be the ID of the slider (same ID used in the initialization code of the slider in question), and the second, a string of either "play" or "pause". This method when called either pauses or plays the slider in question. For example, given a slider with the following initialization code:

<script type="text/javascript">

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: ["Previous", "Next"], //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, 1000], //[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)


The below two links when clicked on dynamically plays/ pauses the slider:

<a href="javascript:featuredcontentslider.playpause('slider1', 'play')">Play</a> <a href="javascript:featuredcontentslider.playpause('slider1', 'pause')">Pause</a>

In your case, you'd just call this method when the tab script is clicked on.

09-08-2011, 02:59 PM
Thank you, worked perfectly :) !!