jQuery detect current thumb and scroll jCarousel accordingly

Question

Another thanks to SLaks for helping me get the code this far.

I'm not quite sure if my last step is even possible with the way I have things set up.

A live version of the gallery can be seen here: http://www.studioimbrue.com/index2.php

Currently, everything works appropriately. The image and its thumbnail are currently tied together, but the jCarousel itself is still independent. I've added nextThumb.closest('.thumbscontainer').jcarousel('next'); so that when you click the large image, the carousel scrolls to the next row, but that doesn't actually follow any pattern. What I'm attempting to do is for jQuery to detect how far down the thumbnail is and when to appropriately scroll the carousel. Is this even possible?

Answer 1

Perhaps this example will help: http://sorgalla.com/projects/jcarousel/examples/static_controls.html

You'll need to figure out the index of the "next" image, then pass that index to scroll().

Update:

Try replacing

nextThumb.closest('.thumbscontainer').jcarousel('next');

with

nextThumb.closest('.thumbscontainer').jcarousel('scroll', nextThumb.index() + 1);