jquery: local/global variables for multiple sliders on one page

Question

I had what I liked to think was the perfect slider written -- it dynamically counts the number of elements, their widths, and adjusts itself accordingly. It works universally, only requiring minimal styling based only on a top-level wrapper ID and works well for different back/next buttons and different sized sliding elements on different pages. But when I tried to do two sliders on the same page I ran into problems. I know it's something to do with making my variables local, and I probably need to run an "each" to cover both sliders on the one page, but I'm confusing myself on how to pull all that off. I think how I broke it down into 3 functions is making this more difficult.

My JS is pasted below. If you want to see it in action, or inaction, with CSS and HTML see http://www.anomie.info/test/test.html. [If you want to see how it's supposed to work, and does work with just one slider on a page, see http://www.anomie.info/test/test.zip with everything zipped up. Note how in the "OK" version in the zip that the back and forward buttons turn on and off appropriately when there are or are not any more slider elements to click through.]

Much thanks for any and all pointers!

// slider
if ($('.slider-inner-wrapper').length) {
    $(window).load(function(){
        slideImageVals = function() {
            wrapperSliderWrapperWidth = $('.slider-inner-wrapper').width();
            wrapperSliderInnerWidth = $('.slider-inner-inner .element-slide').width();
            wrapperSliderInnerLength = $('.slider-inner-inner .element-slide').length;
            wrapperSliderInnerMakeWidth = wrapperSliderWrapperWidth * wrapperSliderInnerLength;
            $('.slider-inner-inner').width(wrapperSliderInnerMakeWidth);
            wrapperSliderInnerSubWidth = wrapperSliderInnerWidth - wrapperSliderInnerMakeWidth;
        }
        slideImageVals();

        slideImageChangeVals = function() {
            wrapperSliderInnerPositionLeft = Math.round($('.slider-inner-inner').position().left);
            wrapperSliderInnerSlideRight = (wrapperSliderInnerPositionLeft + wrapperSliderInnerWidth);
            wrapperSliderInnerSlideLeft = (wrapperSliderInnerPositionLeft - wrapperSliderInnerWidth);

            if ($('.slider-inner-inner .element-slide').length <= 1) {
                $('.slider-button').hide(); 
            }
            if (wrapperSliderInnerPositionLeft < 0) {
                $('.slider-button-back').addClass('active');
            }
            if (wrapperSliderInnerPositionLeft == 0) {
                $('.slider-button-back').removeClass('active');
            }
            if (wrapperSliderInnerMakeWidth > wrapperSliderInnerWidth) {
                $('.slider-button-next').addClass('active');
            }
            if (wrapperSliderInnerPositionLeft <= wrapperSliderInnerSubWidth) {
                $('.slider-button-next').removeClass('active');
            }
        }
        slideImageChangeVals();

        slideImageHoldFlag = function() {
            slideImageChangeVals();
            wrapperSliderInnerFlagLeft = (wrapperSliderInnerPositionLeft / wrapperSliderInnerWidth);
        }
        slideImageHoldFlag();
    });

    $('.slider-button-next').click(function() {
        if ($(this).hasClass('active')) {
            $('.slider-inner-inner').animate({ 'left': wrapperSliderInnerSlideLeft }, {
                        duration: 1000,
                        specialEasing: {
                        left: "easeOutBack"
                    },
                        complete: function() {
                            slideImageHoldFlag();
                    }
                });
        }
    });
    $('.slider-button-back').click(function() {
        if ($(this).hasClass('active')) {
            $('.slider-inner-inner').animate({ 'left': wrapperSliderInnerSlideRight }, {
                        duration: 1000,
                        specialEasing: {
                        left: "easeOutBack"
                    },
                        complete: function() {
                            slideImageHoldFlag();
                    }
                });
        }
    });
}
// end slider

---

for some reason, I'm not able to get it to work on jsfiddle. all apologies for those who prefer jsfiddle.