jQuery(function($) {
    try {

        //by default, the scroll is only done vertically ('y'), change it to both.
        $.scrollTo.defaults.axis = 'xy';

        //this one is important, many browsers don't reset scroll on refreshes
        //reset all scrollable panes to (0,0)
        //$('div.pane').scrollTo( 0 );

        //reset the screen to (0,0)
        // $.scrollTo( 0 );


        //After setting the Scroll defaults - Get the Image Width
        var mImageWidth = $('#scroller-contents li img').css("width").replace('px', '');

        //Get the List Item Margin
        var mListMargin = $('#scroller-contents li').css('margin-right').replace('px', '');

        //Assign the Width to tbx + Add border size
        $('#tbxImageWidth').attr("value", parseInt(mImageWidth) + parseInt(mListMargin) + 4);

        //
        $('#hrefLeftScroll').click(function() {
            ScrollLeft();
        });

        $('#hrefRightScroll').click(function() {
            ScrollRight();
        });
    }
    catch (err) {

    }

});

function ScrollRight() {

    //Get the Target Pane
    var $paneTarget = $('#scroller-container');

    //Get the Image Width
    var $ImageWidth = $('#tbxImageWidth').attr("value");

    //Get the Scroll Position
    var $ScrollPos = $('#tbxscrollposition').attr("value");

    //Count the Image Elements
    var ct = $('#scroller-contents').children().size();

    //Assess the Maximum size
    ct = (parseInt(ct) * parseInt($ImageWidth)) - parseInt($('#scroller-container').width()) - parseInt($ImageWidth);

    if ($ScrollPos <= parseInt(ct)) {
        //Set the New Scroll Pos Value
        $ScrollPos = parseInt($ScrollPos) + parseInt($ImageWidth);

        //Assign the the Tbx
        $('#tbxscrollposition').attr("value", $ScrollPos);

        //Activate the Scroll
        $paneTarget.stop().scrollTo({ top: 0, left: $ScrollPos }, 800);

    }

}

function ScrollLeft() {

    //Get the Target Pane
    var $paneTarget = $('#scroller-container');

    //Get the Image Width
    var $ImageWidth = $('#tbxImageWidth').attr("value");

    //Get the Scroll Position
    var $ScrollPos = $('#tbxscrollposition').attr("value");

    if (parseInt($ScrollPos) > 0) {
        //Set the New Scroll Pos Value
        $ScrollPos = parseInt($ScrollPos) - parseInt($ImageWidth);

        //Assign the the Tbx
        $('#tbxscrollposition').attr("value", $ScrollPos);

        //Activate the Scroll
        $paneTarget.stop().scrollTo({ top: 0, left: $ScrollPos }, 800);
    }
}