Difference between revisions of "JQuery Ui Component Examples"
From Organic Design wiki
(Created page with "<html> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <link type="text/css" href="http://cvs.savannah.gnu.o...") |
(Odd seems to need jquery declared in the page) |
||
(4 intermediate revisions by the same user not shown) | |||
Line 69: | Line 69: | ||
ul#icons span.ui-icon {float: left; margin: 0 4px;} | ul#icons span.ui-icon {float: left; margin: 0 4px;} | ||
</style> | </style> | ||
− | |||
− | |||
<!-- Accordion --> | <!-- Accordion --> | ||
Line 112: | Line 110: | ||
<!-- ui-dialog --> | <!-- ui-dialog --> | ||
− | <div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all" style="width: 302px; height: | + | <div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all" style="width: 302px; height: 172px; position: absolute; left: 50px; top: 30px;"></div></div> |
− | <div style="position: absolute; width: 280px; height: | + | <div style="position: absolute; width: 280px; height: 150px;left: 50px; top: 30px; padding: 10px;" class="ui-widget ui-widget-content ui-corner-all"> |
<div class="ui-dialog-content ui-widget-content" style="background: none; border: 0;"> | <div class="ui-dialog-content ui-widget-content" style="background: none; border: 0;"> | ||
<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> | <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> | ||
Line 157: | Line 155: | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | <br /><br /><br /> | |
</html> | </html> |
Latest revision as of 20:38, 31 October 2010
Accordion
First
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
Second
Phasellus mattis tincidunt nibh.
Third
Nam dui erat, auctor a, dignissim quis.
Tabs
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.
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.
Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.
Dialog
Overlay and Shadow Classes (not currently used in UI widgets)
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.
Slider
Datepicker
Progressbar
Highlight / Error