jQuery image gallery customization

EDIT: this question is partially answered at this point, thanks to Neil who has put me on the right path using the scrollTo plugin; however, as detailed below, I'm still having an issue with getting the "next" and "previous" links to correctly adjust the scrolling thumbnail list as desired. thus, I'm wondering if any other skilled jQuery programmers out there would like to take a stab at this and try to help me overcome this obstacle... thanks much in advance.

/////////////////////////

wondering if any proficient jQuery programmers out there can offer some assistance in modifying an image gallery script: I would like to use Galleriffic in an upcoming project-- a great plugin if you're not familiar-- but instead of dividing the thumbnails into pages, I'd like to have a scrolling div displaying all the thumbs at once, as shown here.

my question is whe开发者_开发百科ther it's possible to have the scrolling list of thumbs "follow" the state of the large image-- that is, if one clicks "next photo" to display a full-size image, and the corresponding thumbnail is out of view, the list will scroll automatically to show the current thumbnail, if that makes sense. I guess such a script would require the full-size image to follow or "sense" the viewable state of thumbnails and adjust visibility as required. Please let me know if I should be more specific.

I'm hoping there's perhaps some existing jQuery function to accomplish this task (?), and I thank you in advance for any direction here.

---

There is a plug-in that will do this for you.

It allows you to specify an element, e.g. a thumbnail 'IMG' to which you would like to scroll. It also allows you to specify effects on how to do the scrolling.

Check out the examples on how to use it.

Regarding your follow-up comment below:

The buttons to move next and previous have the class "next" or "prev" and the anchor containing the large image has the class "advance-link", they all have a "href" attribute to go to the next/previous slide. So, to scroll to the thumbnail for that slide you should code something like that shown below at, or near, the beginning of your jQuery code. I've only inspected it by eye, so it may have a a typo in it, but you should get the drift.:

$('.next, .prev, .advance-link').live().click().function(){
    var href  = $(this).attr('href');
    $('#thumbs').scrollTo($('.thumb[href=' + href + ']'), {axis: 'y'});
});

---

here's a rough example

$('.current img').live('mouseenter',function(){

    var alt = $(this).attr('alt');
    var thumb = $('.thumbs [alt='+alt+']');
    var position = thumb.position();
    var thumbs = $('.thumbs');
    thumbs.scrollTop(position.top);
});