<script type="text/javascript">

	var model = {

		renderAt: '#containerDemo',

		title: 'Tabs Demos',

		demos: [

			{
				title: 'Simple Tabs',
				desc: 'With few lines of code you could make tabs. You can try more options on the fly!',
				html: { url: 'templates/ui.tabs.ex1.html' },
				destroy: '$("tabsEx1 > ul").tabs("destroy");',
				options: [
					{
						desc: 'First tab active by default',
						source: '$("#tabsEx1 > ul").tabs();'
					},
					{
						desc: 'Start With Custom Tab',
						source: '$("#tabsEx1 > ul").tabs({selected:1});'
					},
					{
						desc: 'Use a slide effect to switch tabs',
						source: '$("#tabsEx1 > ul").tabs({ fx: { height: "toggle" } });'
					},
					{
						desc: 'Use a fade effect to switch tabs',
						source: '$("#tabsEx1 > ul").tabs({ fx: { opacity: "toggle" } });'
					},
					{
						desc: 'Use a combined slide and fade effect to switch tabs',
						source: '$("#tabsEx1 > ul").tabs({ fx: { height: "toggle", opacity: "toggle" } });'
					},
					{
						desc: 'Define event to switch tabs (mouseover)',
						source: '$("#tabsEx1 > ul").tabs({  event: "mouseover" });'
					}
				]
			}

		]

	};

	$(function(){

		uiRenderDemo(model);

	});

</script>