Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Are there any 3rd party jQuery UI themes?

I'm a little tired of the jQuery UI themes.

Are there any free 3rd-party themes that look a little slicker?

like image 388
Cocteau Avatar asked Jul 04 '11 19:07

Cocteau


People also ask

What is jQuery UI themes?

jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.

Is jQuery UI responsive?

JQuery UI is used for the development of an user interface based on HTML to make the websites more responsive on all the browsers.

Which are jQuery UI widgets?

a jQuery UI widget is a specialized jQuery plug-in. Using plug-in, we can apply behaviours to the elements. However, plug-ins lack some built-in capabilities, such as a way to associate data with its elements, expose methods, merge options with defaults, and control the plug-in's lifetime.

What is the latest jQuery UI version?

The latest release, 1.18.


2 Answers

Or take the standard jquery-ui.css and nab the parts of it that apply to you e.g. if you're only using tabs then just grab all the tabs css or more if you're using multiple aspects. So for example if you're just using the tabs part take this small section from the

.ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a,     .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }

and then just style change as you please.

like image 82
Flakx Avatar answered Oct 03 '22 23:10

Flakx


One alternative that goes along with my personal style is "Aristo" for jQuery UI!

See the Link!

See the Demo!

See the GitHub!

Nonetheless, themes provided by jQuery UI ThemeRoller were only meant to be a starting point for users to create their own theme.

like image 20
Zuul Avatar answered Oct 03 '22 21:10

Zuul