$(document).ready(function() {
    $('#TabMenu1').liMenu();
});

$.fn.liMenu = function() {
    return this.each(function() {
        var $strip = $(this);
        var stripWidth = 0;
        var ULWidth = 0
        var containerWidth = $strip.parent().parent().width();
        $strip.find("li").each(function(i) {
            stripWidth += jQuery(this, i).width();
            ULWidth += jQuery(this, i).width();
        });
        $strip.width(stripWidth);
        if (ULWidth > $strip.parent().parent().width()) {
            var $elem = $strip.parent();
            $elem.before('<span class="bar_right" onmousedown="scrollDivUp()" onmouseup="clearTimeout(timerUp)">&nbsp;</span> <span class="bar_left" onmousedown="scrollDivDown()" onmouseup="clearTimeout(timerDown)">&nbsp;</span>')
        }
    });
};
var defaultStep = 2;
var step = defaultStep;
function scrollDivDown() {
    //document.getElementById('bar').scrollLeft += step;
    var Scl = $('#bar').scrollLeft();
    $('#bar').scrollLeft(Scl + step);
    timerDown = setTimeout(function() { scrollDivDown() }, 5);
}
function scrollDivUp() {
    //document.getElementById('bar').scrollLeft -= step;
    var Scl = $('#bar').scrollLeft();
    $('#bar').scrollLeft(Scl - step);
    timerUp = setTimeout(function() { scrollDivUp() }, 5);
}

(function($) {
    $.each(['Left', 'Top'], function(i, name) {
        $.fn['scroll' + name] = function(val) {
            if (!this[0]) return;
            return val != undefined ?
			this.each(function() {
			    this == window || this == document ?
					window.scrollTo(
						name == 'Left' ? val : $(window)['scrollLeft'](),
						name == 'Top' ? val : $(window)['scrollTop']()
					) :
					this['scroll' + name] = val;
			}) :
			this[0] == window || this[0] == document ?
				self[(name == 'Left' ? 'pageXOffset' : 'pageYOffset')] ||
					$.boxModel && document.documentElement['scroll' + name] ||
					document.body['scroll' + name] :
				this[0]['scroll' + name];
        };
    });
})