### Tabs Overview

The w2tabs object allows you to create tabs. Tabs can be static or dynamic. Dynamic tabs can be created and/or removed at the runtime. You can also create closable tabs.

#### Example

Below is a simple example how to use tabs. It shows the minimum HTML and JavaScript you need to render the tab bar. It is assumed in the example that you link jquery.js, w2ui.js and w2ui.css files. <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="http://w2ui.com/src/w2ui-1.4.min.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="http://w2ui.com/src/w2ui-1.4.min.js"></script> </head> <body> <div id="myTabs"></div> <div id="myTabsContent" style="height: 400px; padding: 10px; border: 1px solid #ccc; border-top: 0px"> tab1 </div> </body> <script> $(function () { $('#myTabs').w2tabs({ name : 'myTabs', active : 'tab1', tabs : [ { id: 'tab1', caption: 'Tab 1' }, { id: 'tab2', caption: 'Tab 2' }, { id: 'tab3', caption: 'Tab 3' }, { id: 'tab4', caption: 'Tab 4' } ], onClick: function (event) { $('#myTabsContent').html(event.target); } }); }); </script> </html>