source: main/trunk/greenstone3/web/interfaces/oran/js/jquery-ui-1.8rc1/tests/static/button/default.html@ 24245

Last change on this file since 24245 was 24245, checked in by sjb48, 13 years ago

Oran code for supporting format changes to document.

  • Property svn:executable set to *
File size: 5.1 KB
Line 
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <title>Button Static Test : Default</title>
5 <link rel="stylesheet" href="../static.css" type="text/css" />
6 <link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
7 <link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
8 <script type="text/javascript" src="../../../jquery-1.4.1.js"></script>
9 <script type="text/javascript" src="../static.js"></script>
10 <style>
11 div { margin: 0 0 1em; }
12 h2 { margin: 2em 0 1em; }
13 </style>
14</head>
15<body>
16
17 <h2>Using button elements</h2>
18
19 <div>
20 <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
21 <span class="ui-button-text">Button</span>
22 </button>
23
24 <button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
25 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
26 <span class="ui-button-text">Button</span>
27 </button>
28
29 <button class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
30 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
31 <span class="ui-button-text">Button</span>
32 </button>
33
34 <button class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
35 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
36 <span class="ui-button-text">Button</span>
37 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
38 </button>
39
40 <button class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
41 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
42 <span class="ui-button-text">Button</span>
43 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
44 </button>
45 </div>
46
47 <h2>Using anchor elements</h2>
48
49 <div>
50 <a href="#" class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
51 <span class="ui-button-text">Button</span>
52 </a>
53
54 <a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
55 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
56 <span class="ui-button-text">Button</span>
57 </a>
58
59 <a href="#" class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
60 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
61 <span class="ui-button-text">Button</span>
62 </a>
63
64 <a href="#" class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
65 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
66 <span class="ui-button-text">Button</span>
67 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
68 </a>
69
70 <a href="#" class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
71 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
72 <span class="ui-button-text">Button</span>
73 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
74 </a>
75 </div>
76
77
78
79 <h2>Using label elements (used when proxying to radio or check inputs)</h2>
80
81 <div>
82 <label class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
83 <span class="ui-button-text">Button</span>
84 </label>
85
86 <label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
87 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
88 <span class="ui-button-text">Button</span>
89 </label>
90
91 <label class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
92 <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
93 <span class="ui-button-text">Button</span>
94 </label>
95
96 <label class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
97 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
98 <span class="ui-button-text">Button</span>
99 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
100 </label>
101
102 <label class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
103 <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
104 <span class="ui-button-text">Button</span>
105 <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
106 </label>
107 </div>
108
109
110 <h2>Button Sets</h2>
111
112 <div class="ui-button-set">
113 <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-left"><span class="ui-button-text">Simple button</span></button>
114 <button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Simple button</span></button>
115 <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-right"><span class="ui-button-text">Simple button</span></button>
116 </div>
117
118
119
120<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
121<script>
122 $('<div/>').css({
123 position: "absolute",
124 right: 10,
125 top: 10
126 }).appendTo(document.body).themeswitcher();
127</script>
128</body>
129</html>
Note: See TracBrowser for help on using the repository browser.