jQuery EasyUI Layout - create tabs (Tabs)

This tutorial shows you how to use the delay to create a easyui Tabs component. Tabs can have multiple dynamically add or remove the panel (panel). You can use Tabs to display the different entities on the same page.

Tabs only show once a panel (panel), each panel (panel) has a title, icon and close button. When Tabs is selected, the corresponding display panel (panel) content.

Creating Tabs tag from HTML, contains a number of DIV DIV container and panel (panel).

	<Div class = "easyui-tabs" style = "width: 400px; height: 100px;">
		<Div title = "First Tab" style = "padding: 10px;">
			First Tab
		</ Div>
		<Div title = "Second Tab" closable = "true" style = "padding: 10px;">
			Second Tab
		</ Div>
		<Div title = "Third Tab" iconCls = "icon-reload" closable = "true" style = "padding: 10px;">
			Third Tab
		</ Div>
	</ Div>

We create a component with three Tabs panel (panel), the second and third panel (panel) can be closed by clicking the Close button.

Download jQuery EasyUI examples

jeasyui-layout-tabs1.zip