Mercurial > hg > MPIWGThesaurus
comparison jquery-ui/development-bundle/demos/button/checkbox.html @ 0:b2e4605f20b2
beta version
author | dwinter |
---|---|
date | Thu, 30 Jun 2011 09:07:49 +0200 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:b2e4605f20b2 |
---|---|
1 <!DOCTYPE html> | |
2 <html lang="en"> | |
3 <head> | |
4 <meta charset="utf-8"> | |
5 <title>jQuery UI Button - Checkboxes</title> | |
6 <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> | |
7 <script src="../../jquery-1.5.1.js"></script> | |
8 <script src="../../ui/jquery.ui.core.js"></script> | |
9 <script src="../../ui/jquery.ui.widget.js"></script> | |
10 <script src="../../ui/jquery.ui.button.js"></script> | |
11 <link rel="stylesheet" href="../demos.css"> | |
12 <script> | |
13 $(function() { | |
14 $( "#check" ).button(); | |
15 $( "#format" ).buttonset(); | |
16 }); | |
17 </script> | |
18 <style> | |
19 #format { margin-top: 2em; } | |
20 </style> | |
21 </head> | |
22 <body> | |
23 | |
24 <div class="demo"> | |
25 | |
26 <input type="checkbox" id="check" /><label for="check">Toggle</label> | |
27 | |
28 <div id="format"> | |
29 <input type="checkbox" id="check1" /><label for="check1">B</label> | |
30 <input type="checkbox" id="check2" /><label for="check2">I</label> | |
31 <input type="checkbox" id="check3" /><label for="check3">U</label> | |
32 </div> | |
33 | |
34 </div><!-- End demo --> | |
35 | |
36 | |
37 | |
38 <div class="demo-description"> | |
39 <p>A checkbox is styled as a toggle button with the button widget. The label element associated with the checkbox is used for the button text.</p> | |
40 <p>This demo also demonstrates three checkboxes styled as a button set by calling <code>.buttonset()</code> on a common container.</p> | |
41 </div><!-- End demo-description --> | |
42 | |
43 </body> | |
44 </html> |