У меня есть некоторые значки привязки, которые наследуются от .ui-widget-content и .ui-state-default. background-position из .ui-widget-content .ui-state-default переопределяет background-position из .ui-icon-play.
Когда значки привязки наследуются только от .ui-state-default, позиция фона .ui-icon-play имеет более высокий приоритет, чем .ui state default.
Я хочу, чтобы .ui-icon-play переопределил .ui-widget-content .ui-state-default, чтобы получить правильное изображение значка из спрайта изображения.
Как определяется приоритет, когда они оба являются классами и согласно инструментам chrome dev, .ui-icon-play - это строка 232 интерфейса пользователя, тогда как .ui-state-default, .ui-widget-content .ui-state-default - это строка 69?
Также, когда я делаю addClass('.ui-icon-play'), background-position все еще не отменяет значение .ui-widget-content .ui-state-default.
Вот упрощенная версия моего кода:
HTML
<div class="controls-container ui-widget-content">
<div class="rep-controls">
<a id="play" class="ui-state-default ui-corner-all ui-icon ui-icon-play"
title="Play/Pause"></a>
<a id="stop" class="ui-state-default ui-corner-all ui-icon ui-icon-stop"
title="Stop"></a>
</div>
</div>
JS
$("#play").click(function() {
if(playing == true) {
$("#play").removeClass('ui-icon-pause');
else {
$("#play").addClass('ui-icon-pause');
}
});