top&bottomScrollBar.js

(function($) {
    $.fn.getHiddenDimensions = function(boolOuter) {
        var $item = this;
        var props = { position: 'absolute', visibility: 'hidden', display: 'block' };
        var dim = { 'w':0, 'h':0 };
        var $hiddenParents = $item.parents().andSelf().not(':visible');

        var oldProps = [];
        $hiddenParents.each(function() {
        var old = {};

        for ( var name in props ) {
            old[ name ] = this.style[ name ];
            this.style[ name ] = props[ name ];
        }

        oldProps.push(old);
        });

        dim.w = (boolOuter === true) ? $item.outerWidth(true) : $item.width();
        dim.h = (boolOuter === true) ? $item.outerHeight(true) : $item.height();

        $hiddenParents.each(function(i) {
        var old = oldProps[i];
        for ( var name in props ) {
            this.style[ name ] = old[ name ];
        }
        });

        return dim;
    }

    var table = $('#services_tbl');
    var dim = table.getHiddenDimensions(true);

    var scrollwrapper = $('<div id="services_tbl_scroll_wrapper" class="tableview_overflow_wrapper" />');
    var scrollContent = $('<div id="services_tbl_scroll_target" />');
    scrollContent.css({
        'width': dim.w,
        'height': $.browser.mozilla? 18 : 1
    });

    scrollContent.appendTo(scrollwrapper);
    scrollwrapper.insertBefore(table);

    var tablewrapper = $('<div id="services_tbl_tbl_wrapper" class="tableview_overflow_wrapper" />');

    tablewrapper.scroll(function(e){
        $('#services_tbl_scroll_wrapper').scrollLeft($(this).scrollLeft());
    });
    scrollwrapper.scroll(function(e){
        $('#services_tbl_tbl_wrapper').scrollLeft($(this).scrollLeft());
    });

    table.wrap(tablewrapper);

}(jQuery));