Troubles With Multiple Instances Of A jQuery Slider

JavaScript
1

I have added the Flowplayer jQuery scrollable slider to the web page linked below and I am trying to add more than one instance of the slider to that page. So essentially three galleries. Can someone figure out how to rewrite the jQuery function to accommodate the additional scrollable items on the page?

LINK-
Creative Cakery - Karns Tennessee

Thanks in advance!
Todd

2

The script code doesn’t need to change at all, The problem is in how your HTML code is structured.

When scrollable looks around for your prev/next buttons, it goes to the parent of div.scrollable and checks there. On your current page design, that means it searches div.full which contains all three. That’s why you’re experiencing your problem.

The solution is to wrap each prev/scrollable/next section inside their own container, so that scrollable will only find the one appropriate prev/next when it goes searching for them.


[color="green"]<div>[/color]
    <a class="prev browse left"></a> 
    <div class="scrollable">
        <!-- content here -->
    </div>
    <a class="next browse right"></a> 
[color="green"]</div>[/color]
3

Sweet! Thanks so much for the fix but most of all for the explanation. That makes sense. I can’t thank you enough!

Todd