Ticket #3785: accordion.html

File accordion.html, 1.9 KB (added by skeetio, 14 years ago)

Example of accordion behavior bug

Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2                    "http://www.w3.org/TR/html4/loose.dtd">
3<html>
4<head>
5  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
6
7  <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/reset/reset-min.css">
8
9  <link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/trunk/themes/base/ui.all.css" type="text/css" media="screen">
10  <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.6rc4/ui/ui.core.js"></script>
11  <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.6rc4/ui/ui.accordion.js"></script>
12
13  <script type="text/javascript">
14  $(document).ready(function(){
15    $("#example").accordion({
16        alwaysOpen:false,
17        header:'dt'
18    });
19
20    $('button').click(function() {
21
22        var activate = undefined;
23
24        switch($(this).attr('id')) {
25            case 'activate-false':
26                activate = false;
27                break;
28            case 'activate-neg':
29                activate = -1
30                break;
31            case 'activate-0':
32                activate = 0;
33                break;
34            case 'activate-1':
35                activate = 1;
36                break
37        }
38
39        $('#example').accordion('activate',activate);
40
41    });
42
43  });
44  </script>
45
46</head>
47<body>
48    <div id="example">
49        <dl>
50            <dt><a href="#">Foo</a></dt>
51            <dd>Blah Blah Blah</dd>
52        </dl>
53        <dl>
54            <dt><a href="#">Bar</a></dt>
55            <dd>Blah Blah Blah</dd>
56        </dl>
57    </div>
58    <button id="activate-false">Activate with false</button>
59    <button id="activate-neg">Activate with -1</button>
60    <button id="activate-0">Activate first element</button>
61    <button id="activate-1">Activate second element</button>
62</body>
63</html>