Need to be able to tell Next/Prev buttons to look for a specific ID

[sbh]

1) Script Title: Featured Content Slider v2.4

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

3) Describe problem: I have an external.htm file that has 15 separate <div class="contentdiv">. Currently the prev and next buttons allow the user to cycle through all of the content, works fine. Need to limit prev and next buttons to only cycle through sets of 3 <div class="contentdiv"> at a time and I am trying to do this using the onChange and element IDs.

Link to the example: http://www.samhuss.org/testsites/dwelling/gallery_template6.html

Here is my work so far, I don't know how to get the prev and next button to stop at the desired Id's ...am I even close? Please help. Thank you in advance.

[CODE]
onChange: function(previndex, curindex){
var name = 1
var name = 2
var name = 3
var name = 4
var name = 5
if (previndex == 1)
var name = document.getElementById("project1")
else if (previndex == 2)
var name = document.getElementById("project2")
else if (previndex == 3)
var name = document.getElementById("project3")
else if (previndex == 4)
var name = document.getElementById("project4")
else if (previndex == 5)
var name = document.getElementById("project5")
}
[code]

[ddadmin]

First the obvious approach- have you considered simply putting 3 contents at once into each <div class="contentdiv"> tag, so they are treated as a single content? That way each pagination link calls up 3 "contents" without any further changes required.

[sbh]

I think maybe I was unclear. When a small image within the scrolling menu on the left of the page is clicked, it jumps to a specific slide in the external html file that loads on the right hand side.

The prev and next buttons that are part of the onChange event need to cycle through a series of 3 images, but not go further than those 3 images (forward or backward). Basically the element ids would act as boundaries.

I tried your suggestion and I have the same dilemma, just with fewer <div class="contentdiv">s. Thank you for responding btw.

To illustrate what I am trying to do a bit better, I have put together the following example using my original files. Above each photo on the right is a description in orange of how the photos relate to one another.

http://samhuss.org/testsites/dwelling/example/gallery_template6.html

Still looking at onChange event as the way to go, but I am stuck. What do you suggest? Please help.

[ddadmin]

Ah ok I think I finally understand what you're trying to do. Let me try and respond later today, as it's really late over here right now.

[ddadmin]

Ok, this is turning out to be a bit more complicated (logically) than I had anticipated. It looks like directly modifying the .js file would be the easier approach. Try the below modified .js file. It should limit the "prev" and "next" pagination links to just 3 slides back and forth from the slide that's explicitly called up.

[sbh]

Thank you so much for your help!!!!!!!! That works perfect!!!!

[sbh]

Discovered that after about twenty clicks of the prev and next buttons that those buttons disappear, but the external content still is viewable and can be accessed by the jumptos.

Within the contentslider.js file, is there a parameter that would limit the amount of clicks of the prev and next buttons? Any ideas?

http://samhuss.org/testsites/dwelling/example/gallery_template6.html

[sbh]

Problem fixed. Increased the z-index for .pagination class. Z-index that is referenced in contentslider.js was pulling z-index from this class.