팝 오버와 대화 사이의 관계를 명확히합니다

Popovers ( 속성 사용)과 대화 상자 ( 요소 및 액세스 가능한 역할)의 차이는 종종 혼란을 유발합니다. 많은 기사들이 이것을 명확히하려고 시도하지만 문제는 지속됩니다. 이 설명은 결정적인 이해를 제공하는 것을 목표로합니다. popover <:> 관계 이해 : 팝 오버 및 대화 기술 구현을 뛰어 넘어 더 넓은 관점에 집중합시다. 팝 오버는 사용자가 요소에서 상호 작용 (클릭, 호버 또는 초점)을 상호 작용할 때 나타나는 콘텐츠입니다. aria 속성은 이러한 팝업을 , , , 및 를 포함하여 역할로 분류합니다. 결정적으로, 대화 상자는 Popover 대화식 유형 역할을 확장하면 세 가지 주요 유형이 있습니다. <dialog></dialog> 모달 : dialog 오버레이 및 포커스 트래핑을 포함합니다 비 모달 : 오버레이와 초점 포획이 없습니다 경고 대화 상자 :

외관시 화면 리더를 알리십시오. 모달 또는 비 모달 일 수 있습니다

이것은 팝 오버/대화 관계를 추가로 지원합니다. 일부 사람들은 팝 오버가 엄격하게 비 모달이라고 생각하지만, 이것은 부정확합니다. 종종 팝 오버에 존재하는

pseudo element는 aria-haspopup 팝 오버가 모달이 될 수 있다고 제안합니다. 그러나 menu 메소드가 없기 때문에 (listbox)가 부족하여 완전히 기능적인 모달 대화 상자를 생성하는 데 적합하지 않습니다. 건물 양식은 따라서, 팝 오버가 모달이 될 수있는 능력은 대화 상자가 특정 종류의 팝 오버 tree. 팝 오버에 대한 액세스 할 수있는 역할 grid 접근성은 팝 오버가 역할을 수행해야합니다. 적절한 역할에는 dialog : , , , 및 가 등재 된 역할이 포함됩니다. 및 와 같은 더 복잡한 역할도 옵션입니다. 및

는 덜 일반적이지만 잠재적으로 유효한 선택입니다.

<:> 툴팁 : 시각적 대 접근성 시각적으로, 툴팁은 팝 오버와 비슷합니다.

api와 함께 툴팁 구현이 가능합니다

<div popover="" role="tooltip">...</div>

그러나 접근성 가이드 라인은 툴팁에 대화식 컨텐츠가 포함되어서는 안된다고 지시합니다. 대화식 툴팁은 실제로 툴팁이 아닌 대화 대화입니다. Heydon Pickering은 "대화를 생각하고 있습니다. 대화 상자를 사용하십시오." 이것이

에 aria-haspopup tooltip 역할 툴팁은 호버 전용 특성으로 인한 접근성 문제를 제시합니다. Steve Faulkner의 "Toggletips"와 Heydon Pickering의 역할 제공 대안 사용에 대한 제안은 라이브 지역을 활용하여 독자에게 툴팁 컨텐츠를 발표했습니다.

는 팝 오버에 사용될 수 있지만 살아있는 지역 자연은 다른 역할과 구별됩니다. 따라서 핵심 팝 오버 정신 모델에서 생략된다.

status 요약

팝 오버 :

주문형 팝업의 일반적인 용어 대화 상자 : 새 창이나 카드를 만드는 특정 유형의 팝 오버. status 이것은 요소와 status 팝버에 대한 권장되는 권장 역할에는 다음이 포함됩니다.

및

는 덜 전통적이지만 가능하지만 와 호환되지는 않지만 가능합니다.

추가 읽기

aria-haspopup 속성 (Wai-aria 사양, 버전 1.2)
• 시맨틱과 팝 오버 속성 : 언제 어떤 역할을 사용해야합니까? (hidde de vries) aria-haspopup은 더 많습니다 (html5accessibility.com)
• 툴팁 및 토글 팁 (포함 구성 요소) HTML의 대화 요소와 팝 오버의 차이점은 무엇입니까? (Chris Coyier)

(참고 : 참조 된 기사 및 사양에 대한 실제 링크로 괄호 링크를 교체하십시오.)

위 내용은 팝 오버와 대화 사이의 관계를 명확히합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!