Undo CSS from class ui-disable

Question

Undo CSS from class ui-disable

Navigation

#1 by (3 votes)

1

I have navbar as footer .

The first element of navbar has class ui-disabled so it can not be interacted with it.

Here's the FIDDLE

HTML / JQuery

<div data-role="footer" data-position="fixed" data-theme="c" data-tap-toogle="false">
            <div data-role="navbar" data-grid="b">
                    <ul>
                       <li class="ui-disabled"><a id="listSO_options">Opções</a></li>
                       <li><a class = "ui-btn-active  nav" href="#">menu</a></li>
                       <li><a class = "nav" href="#" id="listSO_btnDef" data-icon="gear">Definições</a></li>
                    </ul>
            </div>
</div><!-- footer -->

Question

As you notice in the fiddle, the first element is more faded than the next two. Is it possible, using CSS and keeping the first element with the class ui-disabled , makes it identical to the remaining li 's?

If I have been unspecified: can you override the CSS characteristic of class ui-disabled ?

html jquery css

asked by anonymous 13.07.2015 / 13:03

1 answer

Check if select field changed Set up sending mail hosting redHost

score 3 · Accepted Answer

The difference is that disabled has opacity: .3; , resetting opacity to 1 solves the problem.

Using

$('[data-role="navbar"] li:first').css('opacity', 1);

solve the problem.

jsFiddle: link

If you decide to apply the CSS class you have to use !important; to override the rule. Using JavaScript as I mentioned above is not necessary because applying on the element it has priority.