jQuery UI의 대화 상자 모달을 사용하고 있습니다. 대화 상자를 열면 첫 번째 앵커 중 첫 번째 앵커 또는 아무 것도 클릭하지 않고 그 주위에 점선이 나타납니다. 화면의 아무 곳이나 클릭하면 사라집니다. 따라서 대화 상자가 앵커를 활성화하는 것처럼 보입니다. 그러나이 작업을 수행하는 방법은 저를 넘어서는 것입니다.jQuery UI - 앵커 주위에 활성화되어 있으면 안되는 점선 테두리가있는 이유는 무엇입니까?
저는이 점선이 초점을 나타낼 것이라고 확신합니다. jquery-ui가 실제로 첫 번째 하이퍼 링크에 초점을 맞추고있는 경우 일 수도 있지만 (jquery-ui 소스 코드를 사용하지 않고) 브라우저가 독자적으로 수행하는 것이 그럴듯하다고 생각합니다.
브라우저의 경우 대화 상자 div가 포커스를 받기 때문에 브라우저의 유일한 방법은 해당 div의 첫 번째 대화 형 항목 인 앵커에 초점을 맞추는 것입니다.
대화 상자 div에 앵커가없는 경우 어떻게됩니까? 앵커 앞에 텍스트 입력이 있으면 어떻게됩니까?
브라우저에서 수행하는 작업 인 경우 직접 해보고 걱정하지 마세요. 많은 시간을 낭비하고 다른 브라우저와 달리 코드를 유지 관리하기가 어렵습니다.
필자는 jQuery UI 데모 페이지 (http://jqueryui.com/demos/dialog/)를 방문했는데 Firefox 3.6에는이 문제가있는 것으로 나타 났으므로 사용자가 브라우저 만 사용한다는 가정하에 다소 정확합니다. . 그리고 예, 앵커가없는 경우 아무 것도 점선으로 표시되지 않습니다. 그러나 웹킷과 IE에는 jQuery UI의 데모 페이지에 점선이 없지만 barebone 테스트 대화 상자를 만들면 어떻게됩니까? 이 문제를 일으키는 원인이 확실하지 않습니다. 드루팔 (Drupal) 빌드에서 사용하고 있습니다. 아마도 충돌이있을 수 있습니다. 나는 아마도 내 개인 사이트에서 테스트를 시도하고 거기에서 발생하는지 확인합니다. – NerdCowboy
왜 이런 일이 발생하는지 명확하게 알 수는 없지만이 동작을 변경하려는 경우 CSS에 추가하면 외곽선이 사라집니다.
div.ui-dialog a { outline: none }
새로운 Jquery-UI 1.10.3에서는 .ui-button {outline : none;}을 설정해야했습니다. – gbs
동일한 문제가 여기에 있습니다. –