In use on http://www.beaconnected.com/cleansenew/?page_id=543

healthguide.js

jQuery(function() {
    var myApi, verts;

    // Query for sub-navigation elements. Make each vertically
    // scrollable. Save query object as local variable to allow
    // methods to be added to the instance.
    verts = $(".vertScrollable").each(function(i, e) {
        $(e).scrollable({
            vertical: true,
            prev: ".healthup",
            next: ".healthdown"
        });
    });

    // Add resetScroll method to sub-navigation query instance
    verts.resetScroll = function () {
        this.each(function (i, e) {
            $(e).data("scrollable").seekTo(0);
        });
    };

    $("#scrollable").scrollable();
    myApi = $("#scrollable").data("scrollable");

    // Iterate through a list of class selectors mapped to indicies.
    // Bind a click event listener to each element returned by the
    // selector query. On click, scroll to the index mapped to the
    // selector and reset the subnavigation scrolling to zero.
    $.each({
        ".nutrition": 0,
        ".fitnessExercise": 1,
        ".beautySkincare": 2,
        ".mindfulness": 3,
        ".quicktips": 4,
        ".recipes": 5,
        ".glossary": 6
    }, function (selector, index) {
        $(selector).click(function () {
            myApi.seekTo(index);
            verts.resetScroll();
        });
    });

});

It looks like scrollable only applies to the first element in the query. You will have to call .each() on the jQuery object to have the jQuery Tools plugin apply to all elements in returned by the query.

This will get the vertical scrolling working for all the navigation elements, but there is still a bug. If you scroll down while in "Nutrition", you are taken to "Bio-individuality". That's good, but then select "Fitness & Exercise". You see "Dance". I assume that's not the behavior you want.

... you're a god.

No, that's not the behavior I had in mind, but I had an idea that would be the case. Would a reset be possible when clicking any of the side navigation elements?

Question, so I understand the issue better: why does scrollable only apply to the first element in the query? I thought since all sidebar navigation was nested within "scrollable," that it would apply to "each" instance...?