A TabContainer is a container that has multiple panes, but shows only
one pane at a time. There are a set of tabs corresponding to each pane,
where each tab has the title (aka label) of the pane, and optionally a close button.
Here's a Grimm set of tabs, indeed.
Once upon a time there was a dear little girl who was loved by
every one who looked at her, but most of all by her grandmother,
and there was nothing that she would not have given to the child.
Hard by a great forest dwelt a poor wood-cutter with his wife
and his two children. The boy was called Hansel and the girl Gretel.
He had little to bite and to break, and once when great dearth fell
on the land, he could no longer procure even daily bread.
There was once upon a time a hermit who lived in a forest at the foot
of a mountain, and passed his time in prayer and good works,
and every evening he carried, to the glory of God, two pails of water
up the mountain.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>TabContainer Demo
</title>
<style type="text/css">
@import "http://o.aolcdn.com/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "http://o.aolcdn.com/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="http://o.aolcdn.com/dojo/1.0.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
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="LittleRed" dojoType="dijit.layout.ContentPane" title="Little Red Cap">
Once upon a time there was a dear little girl who was loved by
every one who looked at her, but most of all by her grandmother,
and there was nothing that she would not have given to the child.
</div>
<div id="HanselGretel" dojoType="dijit.layout.ContentPane"
title="Hansel and Gretel" closable="true" selected="true">
Hard by a great forest dwelt a poor wood-cutter with his wife
and his two children. The boy was called Hansel and the girl Gretel.
He had little to bite and to break, and once when great dearth fell
on the land, he could no longer procure even daily bread.
</div>
<div id="GreenTwigs" dojoType="dijit.layout.ContentPane"
title="The Three Green Twigs">
There was once upon a time a hermit who lived in a forest at the foot
of a mountain, and passed his time in prayer and good works,
and every evening he carried, to the glory of God, two pails of water
up the mountain.
</div>
</div>
</body></html>