JQuery UI - удалить границу оранжевого вклада на фокусе

Я пытаюсь удалить эту границу:

и поскольку он показан только в фокусе, я не могу найти, какой класс перезаписать, используя консоль хром.

Кто-нибудь это сделал и знал, что такое класс, который я должен перезаписать?

Изменить: я полагаю, что это стандартное поведение и здесь вы можете увидеть пример. Я также использую Chrome.

Ответ 1

li a
{
    outline-color: transparent;
}

Ответ 2

БЫСТРОЕ РЕШЕНИЕ:

Решение, если вы хотите повлиять на фактический элемент .ui.

.ui-state-active a, .ui-state-hover a {
    outline: none;
}

Какая разница между ответами Анона и Константина D?

Anon по праву нацелился на фактический "тег" внутри тега "li". Всегда помните, что tabs(); использует "теги" внутри несортированного списка. Фактически отображать навигацию по вкладкам.

Пример:

CSS тоже влияет на контур на li: теги

.ui-state-active a, .ui-state-hover a {
    outline: none;
}

Опустить виджет jQuery UI Tabs

$('#my-tabs').tabs();

Разметка вкладок в HTML

<div id="my-tabs">
    <ul>
        <li><a href="#tab-1">Tab 1</a></li>
        <li><a href="#tab-2">Tab 1</a></li>
    </ul>
    <div id="tab-1"></div>
    <div id="tab-2"></div>
</div>

Ответ 3

Мне нравится решение Daniel, я бы просто добавил к нему следующее:

.ui-state-active a, .ui-state-hover a, .ui-state-visited a, .ui-state-focus a  {
    outline: none;
}

.ui-state-visited a и .ui-state-focus a остановите его, показывая выделение, когда вы нажимаете другую вкладку/ваша мышь покидает область зависания

Ответ 4

Мой ответ - это сочетание всех вышеперечисленных ответов простым и коротким использованием следующих

.ui-tabs .ui-tabs-nav li a { 
    outline:none;
}

Ответ 5

Вы можете переопределить классы ui-state-focus и ui-state-active css.

.ui-state-focus {
    border: none;
    outline: none;
}

.ui-state-active {
    border: none;
    outline: none;
}

В случае jQuery UI вкладки, переопределяющие ui-state-active, должны быть достаточными.

Обновление. В вашем случае это не активный класс ui-state, а обычный контур привязки в webkit. Я обновил вашу скрипку: http://jsfiddle.net/ukPW6/4/

Ответ 6

принятый ответ работает в Firefox, но у меня были проблемы с ним в Chrome на Mac.
атрибут контурного стиля, похоже, решил это для меня.

.ui-state-focus {
        outline-style:none;
    }

Ответ 7

Если вышеприведенные решения все еще не работают, это вызвано свойством box-shadow. Попробуйте следующее:

.ui-state-focus:focus, .ui-state-focus, li a {
    box-shadow:none;
}

Ответ 8

У меня была такая же проблема. jQuery mobile применяет классы во время выполнения, я пробовал выше решения, но это не сработало для меня, тогда я удалил ui-shadow класс <div data-role="navbar" class="ui-corner-all"> Это выполнило мое требование.