Слайдер jQueryUI как убрать границу маркера

Question

Я успешно изменил фоновое изображение ， просто желтая рамка, которая появляется каждый раз, когда я нажимаю на ручку. Эта граница остается, пока я не нажму где-нибудь еще на странице. Более того, эта граница мигает каждый раз, когда ручка перемещается. У кого-то была такая же проблема до Но никто не ответил.

Как я могу удалить эту границу?

это моя страница (временная ссылка удалена)

Answer 1

.ui-slider a {outline:none;} /* a img { outline:none } for reference

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

Chrome, Safari и FF показывали его в той или иной форме: Safari показывал его синим цветом, FFпоказал его в виде пунктирного контура ...

IE6, IE7 ничего не показал.

** Редактировать **
Вместо удаления контура вы можете рассмотретьстилизация под ваш дизайн.Это говорит пользователю клавиатуры, что ручка теперь находится в фокусе, если ваш ползунок доступен / дружествен по клавише со стрелкой.

.ui-slider a:focus { outline:1px dotted gray }

Answer 2

Я не уверен, что это лучше / хуже данного ответа, но из того, что я могу сказать, я думаю, что я предпочитаю способ, которым я всегда делал это, прежде чем наткнулся на эту тему, и думал, что поделюсь этим с другими на будущее, если кто-то захочет сделать это так. Я получил хорошие результаты. Я думаю, что это определенно нацелено на фактическую ручку более точно:

Добавьте это в свой CSS-файл:

.ui-slider .ui-slider-handle:focus { outline: none; }

Answer 3

В вашем документе отсутствует запятая css

.ui-widget-content .ui-state-focus,

Он также применяется не к изображению, а к тегу, поэтому

img { border:none; }

не должно работать.