Create Accordian Pane with your code

 
<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.AccordionContainer");
      dojo.addOnLoad(show);
      
      function show() {
        var myDijit = new dijit.layout.AccordionContainer({
          duration : 900
        });
        dojo.byId("my").appendChild(myDijit.domNode);
        myDijit.domNode.style.width = "300px";
        myDijit.domNode.style.height = "800px";
        var myPane1 = new dijit.layout.AccordionPane({
          selected : false, title : "Pane 1"
        });
        myPane1.setContent("first");
        myDijit.addChild(myPane1);
        var myPane2 = new dijit.layout.AccordionPane({
          selected : true, title : "Pane 2"
        });
        myPane2.setContent("second");
        myDijit.addChild(myPane2);
        var myPane3 = new dijit.layout.AccordionPane({
          selected : false, title : "Pane 3",
          href : "yourPage.htm"
        });
        myDijit.addChild(myPane3);
        myDijit.startup();
      }      
    </script>
  </head>
  <body class="tundra">
    <div id="my">&nbsp;</div>
  </body>
</html>

Dojo-toolkit.zip( 3,849 k)

Related examples in the same category

1.	Create dijit.layout.AccordionContainer
2.	Nested Accordion Pane
3.	Set title for Accordion Pane
4.	Create Accordion Pane declaratively

Create Accordian Pane with your code : Accordion Pane « Dojo toolkit « JavaScript DHTML

Related examples in the same category