window.addEvent('domready', function() {
	var scrollables = $$('.scrollerV');
	scrollables.each(function(element, index) {
		var divScrollArea = new Element('div', {id: 'scrollarea' + index.toString(), 'class': 'scrollarea'});
		var divScrollBack = new Element('div', {id: 'scrollBack' + index.toString(), 'class': 'scrollBack'});
		var divScrollBarContainer = new Element('div', {id: 'scrollBarContainer' + index.toString(), 'class': 'scrollBarContainer'});
		var divScrollKnob = new Element('div', {id: 'scrollKnob' + index.toString(), 'class': 'scrollKnob'});
		var divScrollForward = new Element('div', {id: 'scrollForward' + index.toString(), 'class': 'scrollForward'});
		divScrollKnob.inject(divScrollBarContainer);
		divScrollBack.inject(divScrollArea);
		divScrollBarContainer.inject(divScrollArea);
		divScrollForward.inject(divScrollArea);
        var bodys = $$('body');
        var body = bodys[0];
		divScrollArea.inject(body, 'top');
		var knobSize = divScrollKnob.getStyle('height').toInt();
		//var pos = element.getCoordinates();
        var pos = element.getPosition();
		var left = pos.x;
		var top = pos.y;
		divScrollArea.setStyle('top', top);
		divScrollArea.setStyle('left', left);
		var scroller = new MooScroller(element, $('scrollKnob' + index.toString()), {
			scrollLinks: {
				forward: $("scrollForward" + index.toString()),
				back: $("scrollBack" + index.toString())
			},
			maxThumbSize: knobSize
		});
		if (scroller.options.hideWhenNoOverflow && scroller.knobSize == scroller.trackSize) {
			divScrollArea.setStyle('display','none');
		}
	});
});
window.addEvent('resize', function() {
	var scrollables = $$('.scrollerV');
	scrollables.each(function(element, index) {
		var divScrollArea = $('scrollarea' + index.toString());
		var pos = element.getPosition();
		var left = pos.x;
		var top = pos.y;
		divScrollArea.setStyle('top', top);
		divScrollArea.setStyle('left', left);
	});
});
