Difference between revisions of "ARIA Tree"

From Level Access Web Labs
Jump to navigation Jump to search
Line 8: Line 8:
 
   }
 
   }
 
   </style>
 
   </style>
 +
  <script type="text/javascript">
 +
    function test() {
 +
      var col = document.querySelector("#tree li);
 +
      document.getElementById("in").value = col.length;
 +
    }
 +
  </script>
 
</head>
 
</head>
 
<body>
 
<body>
Line 13: Line 19:
 
<label id="courses">Courses 2</label>
 
<label id="courses">Courses 2</label>
 
<ul id="tree" class="tree" role="tree" aria-labelledby="courses">
 
<ul id="tree" class="tree" role="tree" aria-labelledby="courses">
   <li aria-label="web" aria-level="1"id="web" role="treeitem" tabindex="0" aria-expanded="true">Web
+
   <li aria-label="web" aria-level="1" id="web" role="treeitem" tabindex="0" aria-expanded="true">Web
 
     <ul role="group">
 
     <ul role="group">
 
       <li aria-label="web basics" aria-level="2" id="webbasic" role="treeitem" tabindex="0">Web Basic</li>
 
       <li aria-label="web basics" aria-level="2" id="webbasic" role="treeitem" tabindex="0">Web Basic</li>
Line 26: Line 32:
 
   </li>
 
   </li>
 
</ul>
 
</ul>
 +
 +
<div>
 +
  <input type="text" id="in" value="" /> <button onclick="test();"> test
 +
</button>
 +
</div>
  
 
<div id="tree" class="tree" role="tree" aria-labelledby="courses">
 
<div id="tree" class="tree" role="tree" aria-labelledby="courses">

Revision as of 22:45, 6 November 2015

  • Web
    • Web Basic
    • Web Advanced
  • PDF
    • PDF Basic
    • PDF Advanced
Web
Web Basic
Web Advanced
PDF
PDF Basic
PDF Advanced