Ticket #4935: accordion_test.html

File accordion_test.html, 1.6 KB (added by Panman01, 13 years ago)

Example code

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml">
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5<title>Accordion with List</title>
6<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/start/jquery-ui.css" type="text/css" />
7<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
8<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
9<script type="text/javascript">
10$(function(){
11        $('.atest').accordion({ autoHeight: false });
12});
13</script>
14</head>
15
16<body>
17<p>Below is an accordion with a list of links at the content. In IE6 the links dissapear, cause is the autoHeight option.</p>
18<div class="atest">
19  <h2><a href="#">Test</a></h2>
20  <div>
21     <ul>
22       <li><a href="#">Abc</a></li>
23       <li><a href="#">Abc</a></li>
24       <li><a href="#">Abc</a></li>
25       <li>Content</li>
26       <li><a href="#">Abc</a></li>
27     </ul>
28  </div>
29  <h2><a href="#">Test</a></h2>
30  <div>
31     <ul>
32       <li><a href="#">Abc</a></li>
33       <li><a href="#">Abc</a></li>
34       <li><a href="#">Abc</a></li>
35       <li><a href="#">Abc</a></li>
36     </ul>
37  </div>
38  <h2><a href="#">Test</a></h2>
39  <div>
40     <ul>
41       <li><a href="#">Abc</a></li>
42       <li><a href="#">Abc</a></li>
43       <li>Test content</li>
44       <li><a href="#">Abc</a></li>
45       <li><a href="#">Abc</a></li>
46     </ul>
47  </div>
48</div>
49</body>
50</html>