How to prevent jQuery (or jquery ui) from setting ui-state-disabled to div?

Question

I use jquery draggable and when i do

$(".a-div").draggable({disabled:true})

jquery sets ui-state-disabled to this div. ui-state-disabled is "implemented" in jquery ui css.

I still need jquery ui css. I would prefer not to change ui-state-disabled, so I can use it somewhere else.

Is it possible to prevent the inclusion of jquery from ui-state-disabled?

Since disabled:true seems to set this css class, is there any other way to disable draggable objet?

Answer 1

You can also just override css in your own local css. That is, embedded or in a file that you import into your page, add the css rule:

 .ui-state-disabled { background-image: none; opacity: 1; } 

Where, in this case, I redefined the opacity value.

This can cause problems if you really want to use this class elsewhere, in which case programmatically adding / removing a class to / from selected elements (as Alphonso suggests) is probably the best way.

Answer 2

These classes are defined in the jQueryUI core, if you really want to change it to something else, you can either crack the code (not recommended for convenience and functionality), or do something ugly:

 $('.ui-state-disabled').removeClass('ui-state-disabled').addClass('yourPreferredClassName');