	var canvasdiv,scrollerdiv;
		var canvasstyle,scrollerstyle;
		var timer;
		var numofstops=0;
		function init()
		{
			
			canvaswidth=260;
			canvasheight=19;
			canvasdiv = document.getElementById('canvas');
			scrollerdiv =document.getElementById('scroller');
			
			canvasstyle =new xbStyle(canvasdiv);
			canvasstyle.setClipWidth(canvaswidth);
			canvasstyle.setClipHeight(canvasheight);
			scrollerstyle =new xbStyle(scrollerdiv);
			scrollerstyle.setWidth(canvaswidth);
			canvasstyle.setVisibility('visible');
		}
		function move(x,y)
		{
			var timeout;
			if(scrollerstyle.getLeft()<=0-scrollerstyle.getWidth())
			{
				scrollerstyle.moveBy(scrollerstyle.getWidth(),y);
			}
			if(scrollerstyle.getLeft()>=canvasstyle.getWidth()+canvasstyle.getLeft()-80)
			{
				scrollerstyle.moveTo(0,y);
			}
			
			if(scrollerstyle.getTop()<=0-scrollerstyle.getHeight())
			{
				scrollerstyle.moveBy(x,scrollerstyle.getHeight());
				numofstops=0;
			}
			if(scrollerstyle.getTop()>canvasstyle.getClipBottom())
			{
				scrollerstyle.moveTo(x,0-scrollerstyle.getHeight());
			}
			scrollerstyle.moveBy(x,y);
			//scrollerstyle.moveTo(scrollerstyle.getLeft()+x,scrollerstyle.getTop()+y);
			if(scrollerstyle.getTop() <= -numofstops*canvasheight)
			{
				stop();
				timeout =1000;
				numofstops++;
			}
			else
			{
				timeout =100
			}
			timer =setTimeout("move("+x+","+y+")",timeout);
		}
		function stop()
		{
			clearTimeout(timer);
		}
