Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 132 lines (96 sloc) 3.386 kB
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
1 <!DOCTYPE html>
2 <html>
3 <head>
4
5 <meta content="text/html; charset=UTF-8" http-equiv="content-type">
6 <title>Tests for hiding/showing elements</title>
7
8 <style type="text/css">
9
10 .section {
11 border: 1px solid #CCC;
12 padding: 2em;
13 margin: 2em;
14 }
15
16 .test {
17 padding: 2em;
18 margin: 2em 0 0;
19 width: 300px;
20 background: #CCF;
21 -webkit-border-radius: 1em;
22 -moz-border-radius: 1em;
23 border-radius: 1em;
24 -webkit-box-shadow: 0 0 5px #000;
25 -moz-box-shadow: 0 0 5px #000;
26 box-shadow: 0 0 5px #000;
27 behavior: url(../build/PIE.htc);
28 }
29
30 </style>
31
32 <script type="text/javascript">
33
34 function toggleDisplay( id ) {
35 var el = document.getElementById( id );
36 el.style.display = el.style.display === 'none' ? 'block' : 'none';
37 }
38
39 function toggleVisibility( id ) {
40 var el = document.getElementById( id );
41 el.style.visibility = el.style.visibility === 'hidden' ? 'visible' : 'hidden';
42 }
43
44 </script>
45
46 </head>
47 <body>
48
49 <h1>Tests for hiding/showing elements</h1>
50
51 <div class="section">
52 <h2>Toggle display, hidden initially</h2>
53
54 <button type="button" onclick="toggleDisplay('test1')">Toggle</button>
55
56 <div class="test" id="test1" style="display:none;">
57 Hello PIE
58 </div>
59 </div>
60
61 <div class="section">
62 <h2>Toggle display, shown initially</h2>
63
64 <button type="button" onclick="toggleDisplay('test2')">Toggle</button>
65
66 <div class="test" id="test2">
67 Hello PIE
68 </div>
69 </div>
70
71 <div class="section">
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
72 <h2>Toggle parent display, hidden initially</h2>
73
74 <button type="button" onclick="toggleDisplay('test3')">Toggle</button>
75
76 <div id="test3" style="display:none;">
77 <div class="test">Hello PIE</div>
78 </div>
79 </div>
80
81 <div class="section">
82 <h2>Toggle parent display, shown initially</h2>
83
84 <button type="button" onclick="toggleDisplay('test4')">Toggle</button>
85
86 <div id="test4">
87 <div class="test">Hello PIE</div>
88 </div>
89 </div>
90
91 <div class="section">
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
92 <h2>Toggle visibility, hidden initially</h2>
93
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
94 <button type="button" onclick="toggleVisibility('test5')">Toggle</button>
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
95
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
96 <div class="test" id="test5" style="visibility: hidden">
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
97 Hello PIE
98 </div>
99 </div>
100
101 <div class="section">
102 <h2>Toggle visibility, shown initially</h2>
103
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
104 <button type="button" onclick="toggleVisibility('test6')">Toggle</button>
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
105
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
106 <div class="test" id="test6">
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
107 Hello PIE
108 </div>
109 </div>
110
55cce89 Add tests for reacting to show/hide of ancestor elements
Jason Johnston authored
111 <div class="section">
112 <h2>Toggle parent visibility, hidden initially</h2>
113
114 <button type="button" onclick="toggleVisibility('test7')">Toggle</button>
115
116 <div id="test7" style="visibility: hidden">
117 <div class="test">Hello PIE</div>
118 </div>
119 </div>
120
121 <div class="section">
122 <h2>Toggle parent visibility, shown initially</h2>
123
124 <button type="button" onclick="toggleVisibility('test8')">Toggle</button>
125
126 <div id="test8">
127 <div class="test">Hello PIE</div>
128 </div>
129 </div>
130
bf3d9f2 Fix bug where css3 renderings would not get updated when the target e…
Jason Johnston authored
131 </body>
132 </html>
Something went wrong with that request. Please try again.