Three tabs : TabContainer « Dojo toolkit « JavaScript DHTML

Three tabs

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css"
      href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
            dojo.require("dojo.parser");
           dojo.require("dijit.layout.ContentPane");
           dojo.require("dijit.layout.TabContainer");
           dojo.require("dijit.form.Button");

    </script>
  </head>
  <body class="tundra">
   <div id="mainTabContainer" dojoType="dijit.layout.TabContainer" style="width:500px;height:100px">
      <div id="tab1" dojoType="dijit.layout.ContentPane"  title="First Tab"  selected="true" closable="true">
      First Tab
      </div>
      <div id="tab2" dojoType="dijit.layout.ContentPane" title="Second Tab" closable="true">
      Second Tab
      </div>
      <div id="tab3" dojoType="dijit.layout.ContentPane" title="Third Tab" closable="true">
      Third Tab
      </div>
   </div>
  </body>
</html>

Dojo-toolkit.zip( 3,849 k)

Related examples in the same category

1.	Set Tab position
2.	Set tab title
3.	Tabbed pane with title
4.	Create Tab container
5.	Create TabContainer
6.	Close tab event