forked from slexx1234/jquery-ui-sass
-
Notifications
You must be signed in to change notification settings - Fork 0
/
bootstrap-3.html
56 lines (56 loc) · 43.2 KB
/
bootstrap-3.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta content="IE=edge" http-equiv="X-UA-Compatible"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><link rel="shortcut icon" href="assets/img/favicon.png"><title>JQuery UI - Bootstrap 3 Theme</title><link href="https://cdn.jsdelivr.net/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"><link href="assets/css/demo.css" rel="stylesheet"><link href="assets/css/bootstrap-3.css" rel="stylesheet"></head><body><nav class="navbar navbar-static-top navbar-default" role="navigation"><div class="container"><div class="navbar-header"><a class="navbar-brand" href="index.html">JQuery UI SASS</a></div><ul class="nav navbar-nav"><li class="nav-item"><a class="nav-link" href="index.html">Home</a></li><li class="nav-item"><a class="nav-link" href="default.html">Themes</a></li><li class="nav-item"><a class="nav-link" href="about.html">About</a></li></ul><ul class="nav navbar-nav pull-right"><li class="nav-item"><a class="nav-link" href="#">GitHub</a></li></ul></div></nav><div class="container"><div class="row"><div class="col-md-2"><ul class="nav nav-pills nav-stacked"><li><a class="dropdown-item" href="/default.html">Default</a></li><li><a class="dropdown-item" href="/bootstrap-3.html">Bootstrap 3</a></li><li><a class="dropdown-item" href="/metro.html">Metro</a></li></ul></div><div class="col-md-10"><h2 class="header-demo">Accordion</h2><div id="accordion"><h3>First</h3><div>Lorem ipsum dolor sit amet. Lorem ipsum
dolor sit amet. Lorem ipsum dolor sit amet.
</div><h3>Second</h3><div>Phasellus mattis tincidunt nibh.</div><h3>Third</h3><div>Nam dui erat, auctor a, dignissim quis.</div></div><h2 class="header-demo">Autocomplete</h2><input id="autocomplete" title="type &quot;a&quot;"><h2 class="header-demo">Buttons</h2><button id="button">A button element</button><br><br><form><div id="radioset"><input id="radio1" type="radio" name="radio"><label for="radio1">Choice 1</label><input id="radio2" type="radio" name="radio" checked><label for="radio2">Choice 2</label><input id="radio3" type="radio" name="radio"><label for="radio3">Choice 3</label></div></form><h2 class="header-demo">Tabs</h2><div id="tabs"><ul><li><a href="#tabs-1">First</a></li><li><a href="#tabs-2">Second</a></li><li><a href="#tabs-3">Third</a></li></ul><div id="tabs-1">Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat.
</div><div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci
urna, blandit id, pretium vel, aliquet ornare,
felis. Maecenas scelerisque sem non nisl.
Fusce sed lorem in enim dictum bibendum.
</div><div id="tabs-3">Nam dui erat, auctor a, dignissim quis,
sollicitudin eu, felis. Pellentesque nisi urna,
interdum eget, sagittis et, consequat vestibulum,
lacus. Mauris porttitor ullamcorper augue.
</div></div><h2 class="header-demo">Dialog</h2><a id="dialog-link" href="#">Open Dialog</a><h2 class="header-demo">Overlay and Shadow Classes <em>(not currently used in UI widgets)</em></h2><div class="fakewindowcontain"><p>Lorem ipsum dolor sit amet, Nulla nec tortor. Donec
id elit quis purus consectetur consequat.
</p><p>Nam congue semper tellus. Sed erat dolor, dapibus
sit amet, venenatis ornare, ultrices ut, nisi. Aliquam
ante. Suspendisse scelerisque dui nec velit. Duis augue
augue, gravida euismod, vulputate ac, facilisis id, sem.
Morbi in orci.
</p><p>Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec,
quam. Nam molestie scelerisque quam. Nullam feugiat cursus
lacus.orem ipsum dolor sit amet, consectetur adipiscing elit.
Donec libero risus, commodo vitae, pharetra mollis, posuere eu,
pede. Nulla nec tortor. Donec id elit quis purus consectetur
consequat.
</p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet,
venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse
scelerisque dui nec velit. Duis augue augue, gravida euismod,
vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus
lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie
scelerisque quam.
</p><p>Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur
adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis,
posuere eu, pede. Nulla nec tortor. Donec id elit quis purus
consectetur consequat. Nam congue semper tellus. Sed erat dolor,
dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante.
</p><p>Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod,
vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar
vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam.
Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur
adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere
eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat.
Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare,
ultrices ut, nisi.
</p><div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all"></div><div class="ui-widget ui-widget-content ui-corner-all"><div class="ui-dialog-content ui-widget-content"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p></div></div></div></div><div id="dialog" title="Dialog Title"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p></div><h2 class="header-demo"><a href="https://www.npmjs.com/package/jquery-ui-iconfont">jquery-ui-iconfont</a></h2><p>Icon License <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC BY-SA 3.0</a></p><h3 class="header-demo">Busy Icons (Loaders/Spinners)</h3><p>Icons from font - example:<br><span class="ui-icon ui-loading-icon ui-icon-<strong>name</strong>></span></p><ul class="ui-widget ui-helper-clearfix" id="icons"><li class="ui-state-default ui-corner-all" title=".ui-icon-balls"><span class="ui-icon ui-loading-icon ui-icon-balls"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle"><span class="ui-icon ui-loading-icon ui-icon-circle"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-comet"><span class="ui-icon ui-loading-icon ui-icon-comet"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-lines"><span class="ui-icon ui-loading-icon ui-icon-lines"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-planet"><span class="ui-icon ui-loading-icon ui-icon-planet"></span></li></ul><h3 class="header-demo">Framework Icons (content color preview)</h3><ul class="ui-widget ui-helper-clearfix" id="icons"><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-n"><span class="ui-icon ui-icon-arrow-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-ne"><span class="ui-icon ui-icon-arrow-1-ne"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-e"><span class="ui-icon ui-icon-arrow-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-se"><span class="ui-icon ui-icon-arrow-1-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-s"><span class="ui-icon ui-icon-arrow-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-sw"><span class="ui-icon ui-icon-arrow-1-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-w"><span class="ui-icon ui-icon-arrow-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-nw"><span class="ui-icon ui-icon-arrow-1-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-n"><span class="ui-icon ui-icon-arrowstop-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-e"><span class="ui-icon ui-icon-arrowstop-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-s"><span class="ui-icon ui-icon-arrowstop-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-w"><span class="ui-icon ui-icon-arrowstop-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-n"><span class="ui-icon ui-icon-arrowreturn-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-e"><span class="ui-icon ui-icon-arrowreturn-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-s"><span class="ui-icon ui-icon-arrowreturn-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-w"><span class="ui-icon ui-icon-arrowreturn-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-n"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-e"><span class="ui-icon ui-icon-arrowrefresh-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-s"><span class="ui-icon ui-icon-arrowrefresh-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-w"><span class="ui-icon ui-icon-arrowrefresh-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-n-s"><span class="ui-icon ui-icon-arrow-2-n-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-ne-sw"><span class="ui-icon ui-icon-arrow-2-ne-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-e-w"><span class="ui-icon ui-icon-arrow-2-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-se-nw"><span class="ui-icon ui-icon-arrow-2-se-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4"><span class="ui-icon ui-icon-arrow-4"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4-diag"><span class="ui-icon ui-icon-arrow-4-diag"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-n"><span class="ui-icon ui-icon-arrowthick-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-ne"><span class="ui-icon ui-icon-arrowthick-1-ne"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-e"><span class="ui-icon ui-icon-arrowthick-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-se"><span class="ui-icon ui-icon-arrowthick-1-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-s"><span class="ui-icon ui-icon-arrowthick-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-sw"><span class="ui-icon ui-icon-arrowthick-1-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-w"><span class="ui-icon ui-icon-arrowthick-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-nw"><span class="ui-icon ui-icon-arrowthick-1-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-n"><span class="ui-icon ui-icon-arrowthickstop-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-e"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-s"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-w"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-n"><span class="ui-icon ui-icon-arrowreturnthick-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-e"><span class="ui-icon ui-icon-arrowreturnthick-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-s"><span class="ui-icon ui-icon-arrowreturnthick-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-w"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-n-s"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-ne-sw"><span class="ui-icon ui-icon-arrowthick-2-ne-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-e-w"><span class="ui-icon ui-icon-arrowthick-2-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-se-nw"><span class="ui-icon ui-icon-arrowthick-2-se-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-n"><span class="ui-icon ui-icon-circle-arrow-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-e"><span class="ui-icon ui-icon-circle-arrow-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-s"><span class="ui-icon ui-icon-circle-arrow-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-w"><span class="ui-icon ui-icon-circle-arrow-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-n"><span class="ui-icon ui-icon-carat-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-ne"><span class="ui-icon ui-icon-carat-1-ne"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-e"><span class="ui-icon ui-icon-carat-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-se"><span class="ui-icon ui-icon-carat-1-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-s"><span class="ui-icon ui-icon-carat-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-sw"><span class="ui-icon ui-icon-carat-1-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-w"><span class="ui-icon ui-icon-carat-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-nw"><span class="ui-icon ui-icon-carat-1-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n-s"><span class="ui-icon ui-icon-carat-2-n-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e-w"><span class="ui-icon ui-icon-carat-2-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n"><span class="ui-icon ui-icon-triangle-1-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-ne"><span class="ui-icon ui-icon-triangle-1-ne"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-e"><span class="ui-icon ui-icon-triangle-1-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-se"><span class="ui-icon ui-icon-triangle-1-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s"><span class="ui-icon ui-icon-triangle-1-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-sw"><span class="ui-icon ui-icon-triangle-1-sw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-w"><span class="ui-icon ui-icon-triangle-1-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-nw"><span class="ui-icon ui-icon-triangle-1-nw"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-n-s"><span class="ui-icon ui-icon-triangle-2-n-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-e-w"><span class="ui-icon ui-icon-triangle-2-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-n"><span class="ui-icon ui-icon-circle-triangle-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-e"><span class="ui-icon ui-icon-circle-triangle-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-s"><span class="ui-icon ui-icon-circle-triangle-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-w"><span class="ui-icon ui-icon-circle-triangle-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-bullet"><span class="ui-icon ui-icon-bullet"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-radio-off"><span class="ui-icon ui-icon-radio-off"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-alert"><span class="ui-icon ui-icon-alert"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-help"><span class="ui-icon ui-icon-help"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-info"><span class="ui-icon ui-icon-info"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-notice"><span class="ui-icon ui-icon-notice"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-grip-diagonal-se"><span class="ui-icon ui-icon-grip-diagonal-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-gripsmall-diagonal-se"><span class="ui-icon ui-icon-gripsmall-diagonal-se"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-horizontal"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-horizontal"><span class="ui-icon ui-icon-grip-dotted-horizontal"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-vertical"><span class="ui-icon ui-icon-grip-solid-vertical"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-vertical"><span class="ui-icon ui-icon-grip-dotted-vertical"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-check"><span class="ui-icon ui-icon-circle-check"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cancel"><span class="ui-icon ui-icon-cancel"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-close"><span class="ui-icon ui-icon-close"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-close"><span class="ui-icon ui-icon-circle-close"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-closethick"><span class="ui-icon ui-icon-closethick"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-close"><span class="ui-icon ui-icon-squaresmall-close"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-close"><span class="ui-icon ui-icon-circlesmall-close"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-minus"><span class="ui-icon ui-icon-minus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-minus"><span class="ui-icon ui-icon-circle-minus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-minusthick"><span class="ui-icon ui-icon-minusthick"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-minus"><span class="ui-icon ui-icon-squaresmall-minus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-minus"><span class="ui-icon ui-icon-circlesmall-minus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-plus"><span class="ui-icon ui-icon-plus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-plus"><span class="ui-icon ui-icon-circle-plus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-plus"><span class="ui-icon ui-icon-squaresmall-plus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-plus"><span class="ui-icon ui-icon-circlesmall-plus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-pencil"><span class="ui-icon ui-icon-pencil"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-copy"><span class="ui-icon ui-icon-copy"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-scissors"><span class="ui-icon ui-icon-scissors"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-clipboard"><span class="ui-icon ui-icon-clipboard"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-disk"><span class="ui-icon ui-icon-disk"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-trash"><span class="ui-icon ui-icon-trash"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-print"><span class="ui-icon ui-icon-print"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-note"><span class="ui-icon ui-icon-note"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-tag"><span class="ui-icon ui-icon-tag"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-folder-collapsed"><span class="ui-icon ui-icon-folder-collapsed"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-folder-open"><span class="ui-icon ui-icon-folder-open"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-document"><span class="ui-icon ui-icon-document"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-document-b"><span class="ui-icon ui-icon-document-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-video"><span class="ui-icon ui-icon-video"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-image"><span class="ui-icon ui-icon-image"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-script"><span class="ui-icon ui-icon-script"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-volume-off"><span class="ui-icon ui-icon-volume-off"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-volume-on"><span class="ui-icon ui-icon-volume-on"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-shuffle"><span class="ui-icon ui-icon-shuffle"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-link"><span class="ui-icon ui-icon-link"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-extlink"><span class="ui-icon ui-icon-extlink"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-locked"><span class="ui-icon ui-icon-locked"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-unlocked"><span class="ui-icon ui-icon-unlocked"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-newwin"><span class="ui-icon ui-icon-newwin"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-home"><span class="ui-icon ui-icon-home"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-bookmark"><span class="ui-icon ui-icon-bookmark"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-star"><span class="ui-icon ui-icon-star"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-power"><span class="ui-icon ui-icon-power"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-refresh"><span class="ui-icon ui-icon-refresh"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-person"><span class="ui-icon ui-icon-person"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-heart"><span class="ui-icon ui-icon-heart"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-key"><span class="ui-icon ui-icon-key"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-lightbulb"><span class="ui-icon ui-icon-lightbulb"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cart"><span class="ui-icon ui-icon-cart"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-clock"><span class="ui-icon ui-icon-clock"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-comment"><span class="ui-icon ui-icon-comment"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-gear"><span class="ui-icon ui-icon-gear"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-flag"><span class="ui-icon ui-icon-flag"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-transfer-e-w"><span class="ui-icon ui-icon-transfer-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-transferthick-e-w"><span class="ui-icon ui-icon-transferthick-e-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-search"><span class="ui-icon ui-icon-search"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-wrench"><span class="ui-icon ui-icon-wrench"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-radio-on"><span class="ui-icon ui-icon-radio-on"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-suitcase"><span class="ui-icon ui-icon-suitcase"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-calculator"><span class="ui-icon ui-icon-calculator"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-calendar"><span class="ui-icon ui-icon-calendar"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-contact"><span class="ui-icon ui-icon-contact"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-open"><span class="ui-icon ui-icon-mail-open"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-pin-s"><span class="ui-icon ui-icon-pin-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-pin-w"><span class="ui-icon ui-icon-pin-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-zoomin"><span class="ui-icon ui-icon-zoomin"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomin"><span class="ui-icon ui-icon-circle-zoomin"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-zoomout"><span class="ui-icon ui-icon-zoomout"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomout"><span class="ui-icon ui-icon-circle-zoomout"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-battery-0"><span class="ui-icon ui-icon-battery-0"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-battery-1"><span class="ui-icon ui-icon-battery-1"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-battery-2"><span class="ui-icon ui-icon-battery-2"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-battery-3"><span class="ui-icon ui-icon-battery-3"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-signal"><span class="ui-icon ui-icon-signal"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-signal-diag"><span class="ui-icon ui-icon-signal-diag"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-arrow-n"><span class="ui-icon ui-icon-circle-b-arrow-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-arrow-e"><span class="ui-icon ui-icon-circle-b-arrow-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-arrow-s"><span class="ui-icon ui-icon-circle-b-arrow-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-arrow-w"><span class="ui-icon ui-icon-circle-b-arrow-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n"><span class="ui-icon ui-icon-carat-2-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e"><span class="ui-icon ui-icon-carat-2-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-s"><span class="ui-icon ui-icon-carat-2-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-w"><span class="ui-icon ui-icon-carat-2-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n-stop"><span class="ui-icon ui-icon-triangle-1-n-stop"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s-stop"><span class="ui-icon ui-icon-triangle-1-s-stop"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-triangle-n"><span class="ui-icon ui-icon-circle-b-triangle-n"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-triangle-e"><span class="ui-icon ui-icon-circle-b-triangle-e"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-triangle-s"><span class="ui-icon ui-icon-circle-b-triangle-s"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-triangle-w"><span class="ui-icon ui-icon-circle-b-triangle-w"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-alert-b"><span class="ui-icon ui-icon-alert-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-help-plain"><span class="ui-icon ui-icon-help-plain"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-help"><span class="ui-icon ui-icon-circle-b-help"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-info-plain"><span class="ui-icon ui-icon-info-plain"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-info"><span class="ui-icon ui-icon-circle-b-info"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-notice-plain"><span class="ui-icon ui-icon-notice-plain"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-notice"><span class="ui-icon ui-icon-circle-b-notice"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-check"><span class="ui-icon ui-icon-circle-b-check"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-check-off"><span class="ui-icon ui-icon-check-off"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-check-on"><span class="ui-icon ui-icon-check-on"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-close"><span class="ui-icon ui-icon-circle-b-close"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-minus"><span class="ui-icon ui-icon-circle-b-minus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-b-plus"><span class="ui-icon ui-icon-circle-b-plus"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-undo"><span class="ui-icon ui-icon-undo"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-redo"><span class="ui-icon ui-icon-redo"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-rename"><span class="ui-icon ui-icon-rename"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-print-b"><span class="ui-icon ui-icon-print-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-table"><span class="ui-icon ui-icon-table"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-ticket"><span class="ui-icon ui-icon-ticket"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-audio"><span class="ui-icon ui-icon-audio"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-movie"><span class="ui-icon ui-icon-movie"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-pdf"><span class="ui-icon ui-icon-file-pdf"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-rtf"><span class="ui-icon ui-icon-file-rtf"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-spreadsheet"><span class="ui-icon ui-icon-file-spreadsheet"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-txt"><span class="ui-icon ui-icon-file-txt"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-word"><span class="ui-icon ui-icon-file-word"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-file-zip"><span class="ui-icon ui-icon-file-zip"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-volume-on-b"><span class="ui-icon ui-icon-volume-on-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-retweet"><span class="ui-icon ui-icon-retweet"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-link-broken"><span class="ui-icon ui-icon-link-broken"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-window"><span class="ui-icon ui-icon-window"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-window-minimize"><span class="ui-icon ui-icon-window-minimize"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-window-sidebar"><span class="ui-icon ui-icon-window-sidebar"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-menu"><span class="ui-icon ui-icon-menu"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-bookmark-b"><span class="ui-icon ui-icon-bookmark-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-star-b"><span class="ui-icon ui-icon-star-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-addon"><span class="ui-icon ui-icon-addon"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-plugin"><span class="ui-icon ui-icon-plugin"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-package"><span class="ui-icon ui-icon-package"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-group"><span class="ui-icon ui-icon-group"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-heart-b"><span class="ui-icon ui-icon-heart-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-heart-beat"><span class="ui-icon ui-icon-heart-beat"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cart-b"><span class="ui-icon ui-icon-cart-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-clock-b"><span class="ui-icon ui-icon-clock-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cloud"><span class="ui-icon ui-icon-cloud"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cloud-b"><span class="ui-icon ui-icon-cloud-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cloud-download"><span class="ui-icon ui-icon-cloud-download"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-cloud-upload"><span class="ui-icon ui-icon-cloud-upload"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-comments"><span class="ui-icon ui-icon-comments"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-globe"><span class="ui-icon ui-icon-globe"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-globe-b"><span class="ui-icon ui-icon-globe-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-location"><span class="ui-icon ui-icon-location"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-navigation"><span class="ui-icon ui-icon-navigation"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-gears"><span class="ui-icon ui-icon-gears"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-camera"><span class="ui-icon ui-icon-camera"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-eye"><span class="ui-icon ui-icon-eye"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-box"><span class="ui-icon ui-icon-box"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-sign-in"><span class="ui-icon ui-icon-sign-in"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-sign-out"><span class="ui-icon ui-icon-sign-out"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-toggle-off"><span class="ui-icon ui-icon-toggle-off"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-toggle-on"><span class="ui-icon ui-icon-toggle-on"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-settings"><span class="ui-icon ui-icon-settings"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-selectbox"><span class="ui-icon ui-icon-selectbox"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-truck"><span class="ui-icon ui-icon-truck"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-database"><span class="ui-icon ui-icon-database"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-databases"><span class="ui-icon ui-icon-databases"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-book"><span class="ui-icon ui-icon-book"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-book-b"><span class="ui-icon ui-icon-book-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-calculator-b"><span class="ui-icon ui-icon-calculator-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-calendar-b"><span class="ui-icon ui-icon-calendar-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-calendar-day"><span class="ui-icon ui-icon-calendar-day"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-address"><span class="ui-icon ui-icon-address"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-phone"><span class="ui-icon ui-icon-phone"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-circle-phone"><span class="ui-icon ui-icon-circle-phone"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-reply"><span class="ui-icon ui-icon-mail-reply"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-replyall"><span class="ui-icon ui-icon-mail-replyall"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-forward"><span class="ui-icon ui-icon-mail-forward"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-mail-send"><span class="ui-icon ui-icon-mail-send"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-newspaper"><span class="ui-icon ui-icon-newspaper"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-screen-display"><span class="ui-icon ui-icon-screen-display"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-screen-laptop"><span class="ui-icon ui-icon-screen-laptop"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-screen-mobile"><span class="ui-icon ui-icon-screen-mobile"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-view-icons"><span class="ui-icon ui-icon-view-icons"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-view-icons-b"><span class="ui-icon ui-icon-view-icons-b"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-view-list"><span class="ui-icon ui-icon-view-list"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-sorting"><span class="ui-icon ui-icon-sorting"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-sorting-asc"><span class="ui-icon ui-icon-sorting-asc"></span></li><li class="ui-state-default ui-corner-all" title=".ui-icon-sorting-desc"><span class="ui-icon ui-icon-sorting-desc"></span></li></ul><h2 class="header-demo">Slider</h2><div class="offset" id="slider"></div><h2 class="header-demo">Datepicker</h2><div id="datepicker"></div><br><input id="datepicker-input" type="text"><h2 class="header-demo">Progressbar</h2><div id="progressbar"></div><h2 class="header-demo">Selectmenu</h2><select id="selectmenu"><optgroup label="Grays"><option>Dark Gray</option><option>Gray</option><option>Light Gray</option></optgroup><optgroup label="Colors"><option>Red</option><option selected>Orange</option><option>Blue</option></optgroup></select><h2 class="header-demo">Spinner</h2><input id="spinner"><h2 class="header-demo">Menu</h2><ul id="menu"><li><div class="ui-menu-item-wrapper">Item 1</div></li><li><div class="ui-menu-item-wrapper">Item 2</div></li><li><div class="ui-menu-item-wrapper">Item 3</div><ul><li><div class="ui-menu-item-wrapper">Item 3.1</div></li><li><div class="ui-menu-item-wrapper">Item 3.2</div></li><li><div class="ui-menu-item-wrapper">Item 3.3</div><ul><li><div class="ui-menu-item-wrapper">Item 3.3.1</div></li><li><div class="ui-menu-item-wrapper">Item 3.3.2</div></li><li><div class="ui-menu-item-wrapper">Item 3.3.3</div></li><li><div class="ui-menu-item-wrapper">Item 3.3.4</div></li><li><div class="ui-menu-item-wrapper">Item 3.3.5</div></li></ul></li><li><div class="ui-menu-item-wrapper">Item 3.4</div></li><li><div class="ui-menu-item-wrapper">Item 3.5</div></li></ul></li><li class="ui-menu-divider"></li><li><div class="ui-menu-item-wrapper">Item 4</div></li><li><div class="ui-menu-item-wrapper">Item 5</div></li></ul><h2 class="header-demo">Tooltip</h2><p id="tooltip"><a href="#" title="That&apos;s what this widget is">Tooltips</a> can be attached to any element. When you hover the element with
your mouse, the title attribute is displayed in a little box next
to the element, just like a native tooltip.</p><h2 class="header-demo">States</h2><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-default"><p><strong>Hey!</strong> Sample ui-state-default style.</p></div></div><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-hover"><p><strong>Hey!</strong> Sample ui-state-hover style.</p></div></div><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-focus"><p><strong>Hey!</strong> Sample ui-state-focus style.</p></div></div><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-active"><p><strong>Hey!</strong> Sample ui-state-active style.</p></div></div><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-highlight"><p><strong>Hey!</strong> Sample ui-state-highlight style.</p></div></div><div class="ui-widget"><div class="ui-corner-all state-demo ui-state-error"><p><strong>Hey!</strong> Sample ui-state-error style.</p></div></div></div></div></div><script src="https://cdn.jsdelivr.net/jquery/2.2.1/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/jquery.ui/1.11.4/jquery-ui.min.js"></script><script src="assets/js/demo.js"></script></body></html>