3
대부분의 경우 키보드를 사용하는 사용자에게는 어려운 시각적 표시가없는 것 같습니다.모달 대화 상자와 같이 웹 브라우저에서 이스케이프 키를 사용하여 종료하면 포커스는 어디로 이동합니까?
이것은 정말 간단한 질문이지만 인터넷을 샅샅이 뒤졌고 답을 찾을 수 없습니다. 내 첫 번째 아이디어는 Firefox의 개발자 도구를 사용하여 *some element*:focus {outline: 2px solid red;}을 사용하여 시각적 인 표시를 만드는 것이었지만, 물론 어떤 요소가 포커스가 작동하는지 알 필요가 있기 때문에 universal selector *:focus {outline:2px solid red;}을 시도했지만 작동하지 않았습니다.
누구나 포커스를 얻고있는 요소에 대한 겉으로보기에는 간단한 질문에 답변 할 수 있습니다 ... 그리고 보너스 명성을 위해 누군가가 실제로 무슨 일이 일어나는지 볼 수있는 코드 스 니펫을 제공 할 수 있습니까?
나는 대답을 알고 싶습니다 흥미로운 질문입니다. 'focus'가 다른 셀렉터에 의해 오버라이드되지 않는지 확인하십시오. '* : focus {outline : 2px solid red! important;}'를 시도하십시오. 이것은 임의의 웹 사이트를 테스트하는 데 효과적이었습니다. – jfeferman
감사합니다. @ jfeferman, 그건 문제가 아니었지만 진단 중에'! important'를 사용하는 것이 좋은 습관이라는 것을 잊었습니다. 잊어 버리면 엄청난 시간을 낭비 할 수 있습니다. 더 많은 조사에서 초점이 뷰포트 외부로 이동하는 것처럼 보일 것입니다 ... 나는 단지 어디에 있는지 모른다. – DragonFist
VoiceOver와 같은 접근성 기술을 사용하면 시각적으로 포커스를 추적 할 수 있습니다. 또한 [activeElement] (https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement)를 살펴보십시오. 이렇게하면 초점을 맞춘 요소에 js 핸들을 줄 수 있습니다. – jfeferman