jquery-uijquery-ui-button

jQueryUI button with multiple styles on single page


I'd like to use several buttons on single page, but I want to have one group which has one style (e.g. red color) and other one with different style (e.g. gray background and red forecolor).

Is it somehow possible?


Solution

  • Yes you can. The way to do this would be to use the css scope option when downloading the ui - http://jqueryui.com/download/

    Simply include the framework, and the include both stylesheets with the different styles. Make sure to apply different css scopes (e.g. .light-style and .dark-style).

    Next, in your html, whenever you show the buttons, add the appropriate CSS scope to the parent element so that the correct style is picked up.

    You can also manually combine the two stylesheets so that you save space. This is assuming you only want the two differing button styles only.