example.html

	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
	<script type="text/javascript" src="http://xoxco.com/projects/code/multipage/jquery.multipage.js"></script>
	<link rel="stylesheet" href="http://xoxco.com/projects/code/multipage/jquery.multipage.css" />
	<script type="text/javascript" src="http://xoxco.com/projects/code/tagsinput/jquery.tagsinput.js"></script>
	<link rel="stylesheet" href="http://xoxco.com/projects/code/tagsinput/jquery.tagsinput.css" />
	<script type="text/javascript">
		$(window).ready(function() {
            $('#multipage').multipage();
			$('form').submit(function(){ alert("Submitted!"); return false;});
		});
		
		function generateTabs(tabs) { 
		
			html = '';
			for (var i in tabs) { 
				tab = tabs[i];
				html = html + '<li class="multipage_tab"><a href="#" onclick="return $(\'#multipage\').gotopage(' + tab.number + ');">' + tab.title + '</a></li>';				
			}
			$('<ul class="multipage_tabs" id="multipage_tabs">'+html+'<div class="clearer"></div></ul>').insertBefore('#multipage');
		}
		function setActiveTab(selector,page) { 
			$('#multipage_tabs li').each(function(index){ 
				if ((index+1)==page) { 
					$(this).addClass('active');
				} else {
					$(this).removeClass('active');
				}
			});			
		}
		
		function transition(from,to) {
			$(from).fadeOut('fast',function(){$(to).fadeIn('fast');});
		
		}
		function textpages(obj,page,pages) { 
			$(obj).html(page + ' of ' + pages);
		}

	</script>
	<style type='text/css'>

		
		p.input label { display:block; }
		
		
		p.input input { width: 200px; }
		.clearer { clear:both; width:100%; height:0px; } 
	</style>
	<form id="multipage">
		<fieldset id="page_one">
			<legend>Basic Details</legend>
			<p class="input">
				<label for="email">Email</label>
				<input name="email" id="email" value="" />
			</p>	
			<p class="input">
				<label for="pass">Pass</label>
				<input name="pass" id="pass" value="" />
			</p>	
		</fieldset>
		<fieldset id="page_two">
			<legend>About You</legend>
			<p class="input">
				<label for="name">Name</label>
				<input name="name" id="name" value="" />
			</p>	

			<p class="input">
				<label for="loc">Location</label>
				<input name="loc" id="loc" value="" />
			</p>		
			
			<p class="input">
				<label for="tags">
				Tags</label>
				<input name="tags" id="tags" value="foo,bar,baz,booda" />
			</p>
		</fieldset>
		<fieldset id="page_three">
			<legend>Stuff</legend>
			<p class="input">
				<label for="age">Age</label>
				<input name="age" id="age" value="" />
			</p>	
			<p class="input">
				<label for="loc">Location</label>
				<input name="loc" id="loc" value="" />
			</p>		
		</fieldset>
		<input type="submit" value="Create User" />
	</form>