Как убрать контур с кнопки, при клике с мыши, но, что бы он оставался при навигации через tab?

Question

[Masla552]

Здравствуйте. При клике на мышь, кнопка переходит в состояние фокуса, и появляется некий голубой контур. Как его убрать? Но так, что бы при попадании через tab, всё таки контур был. Я считаю, этого можно достичь, сбрасывая состояния фокуса из кнопки, сразу после "отжатия" мыши. Как всё же реализовать?

Answer 1

[Фёдор Гребенников]

Нормального, человеческого способа нет.
Вариант 1) Забить болт, оставить нативное поведение
Вариант 2) Если всё же пипец надо, то я бы сделал как-то так:

• Всем кнопкам добавил бы какой-то дополнительный класс, типа "not-pressed"
  
• Для кнопки с наличием этого класса прописал бы аутлайн нужный, а так как класс этот по умолчанию есть, то переключаясь табом мы обводку увидим
  
• При клике на кнопку этот класс бы убирался js-ом, для кнопки без класса аутлайн в css скрыть надо
  
• По какому-то тригеру возвращал бы кнопке класс, чтобы вернуть нормальное состояние с наличием обводки, какой триггер - вопрос хороший, тут надо экспериментировать. Так, чисто на правах размышлений - может что-то типа "по клику вне кнопки" или "по нажатию клавиши"
  

Ничего подобного на практике не пробовал, но как адский костыль должно сработать. Вроде.

Comments

[Masla552]

Спасибо за рекомендации, вроде, хорошо звучит. Попробую внедрить...