window.addEvent('domready',function(){
		
		//SAMPLE 7
		var startItem = 3; //or   0   or any
		var thumbs_mask7 = $('thumbs_mask7').setStyle('left',(startItem*60-568)+'px').setOpacity(0.8);
		var fxOptions7 = {duration:1000, transition:Fx.Transitions.Back.easeOut, wait:false}
		var thumbsFx = new Fx.Style(thumbs_mask7,'left',fxOptions7);
		var hs7 = new noobSlide({
			box: $('box7'),
			items: [0,1,2,3,4,5,6,7],
			handles: $ES('span','thumbs_handles7'),
			fxOptions: fxOptions7,
			onWalk: function(currentItem){
				thumbsFx.start(currentItem*60-568);
			},
			startItem: startItem
		});
		hs7.walk(0);

		//SAMPLE 8
		var hs8 = new noobSlide({
			box: $('box8'),
			startItem: 1,
			items: $ES('h3','box8'),
			size: 480,
			handles: $ES('span','handles8'),
			buttons: {previous: $('prev8'), play: $('play8'), stop: $('stop8'), playback: $('playback8'), next: $('next8') },
			onWalk: function(currentItem,currentHandle){
				//style for handles
				/*
					don't  do some like that
						this.handles.extend(handles8_more).removeClass('active');
					because every walk event "this.handles" is extend permanently, use:
						$extend(hthis.handles,andles8_more).removeClass('active'); OR
						$$(this.handles,handles8_more).removeClass('active');
				*/
				$$(this.handles,handles8_more).removeClass('active');
				$$(currentHandle,handles8_more[this.currentIndex]).addClass('active');
				//text for "previous" and "next" default buttons
				$('prev8').setHTML('<< '+this.items[this.previousIndex].innerHTML);
				$('next8').setHTML(this.items[this.nextIndex].innerHTML+' >>');
			}
		});
		//more "previous" and "next" buttons
		hs8.addActionButtons('previous',$ES('.prev','box8'));
		hs8.addActionButtons('next',$ES('.next','box8'));
		//more handle buttons
		var handles8_more = $ES('span','handles8_more');
		hs8.addHandleButtons(handles8_more);
		//
		hs8.walk(0)

	});