$(document).ready( function()
		{
			$(".scroller-ui").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 = (itemWidth * itemsPerPage)

				$(list).css({"position": "relative", "width": ((pages*itemsPerPage) * itemWidth)});

				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)
				}				
			} )
		} )