Transform all buttons to jQuery UI Button Widget without JavaScript

Question

I've just got interested in jQuery UI Button widget. So in order to apply jQuery UI Button theme we have to do something like this:

$("input[type=button]").button();

But what if I would like to have all my buttons in whole site styled as jQuery UI Button widget. Do I always have to call button() (it will add some startup performance overhead, and as I'm supporting IE7...), or is there a way to generate markup (using server-side ASP .NET Web Forms) that is already jQuery UI Button ready?

You can copy the same CSS styles applied to jQuery buttons but...do you really think it'll impact performance in any way to use JavaScript for this task??? — Adriano Repetti
– Adriano Repetti, Commented Nov 20, 2012 at 18:48
I won't impact but I have a few pages with huge javascript chunks and these pages already load quite long (I want to avoid buttons "transformation flickering" effect)... So I'm just curious. — dragonfly
– dragonfly, Commented Nov 20, 2012 at 18:53

Malkus · Accepted Answer · 2012-11-20 18:58:49Z

1

You are better off using the method to create the button.

You can add the styles for the button my manually adding all of the classes, however; you loose the mouse-over functionality.

You really don't gain much by not calling .button

Fiddle

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" name="test" role="button" aria-disabled="false">
<span class="ui-button-text">test</span>
</button>

answered Nov 20, 2012 at 18:58

Malkus

3,7262 gold badges27 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Transform all buttons to jQuery UI Button Widget without JavaScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related