$(document).ready( function()
		{
			$(".ui-scroller").each( function (i) 
			{
				var list = $("ul",this)[0]
				var items = $("li",list);
				var itemsPerPage = 3;

				var pages = Math.ceil(items.length/itemsPerPage)
				var page = 0;
				
				
				var itemWidth = items[0].clientWidth
				var pageWidth = 690
				
				$(list).css({"position": "relative", "width": ((pages*itemsPerPage) * 690)});
			
				var scrollPane = $("<div class=\"scroller\"></div>").insertBefore( list ).append(list)
				var pagingPane = $("<div class=\"paging\"></div>").insertAfter( list )
				
				if (pages>0)
				{
					$("<a class='prev' href='#'>Previous</a>").appendTo( this ).bind("click", function(e) { scrollTo( page-1 ); e.preventDefault(); return false })
					$("<a class='next' href='#'>Next</a>").appendTo( this ).bind("click", function(e) { scrollTo( page+1 ); e.preventDefault(); return false })
				}
				
				function scrollTo( newPage )
				{		
					switch (newPage)
					{
						case pages: page = 0; break;
						case -1: page = pages-1; break;
						default: page = newPage; break;
					}

					var end = page * pageWidth
					$(list).stop();
					$(list).animate({left: -end +"px"},350)
				}				
			} )
		} )