क्या एक सुलभ मोडल करने का कोई तरीका है?

Question

मैं ट्विटर बूटस्ट्रैप के साथ एक प्रोजेक्ट पर काम कर रहा हूं और स्क्रीन रीडर का उपयोग कर JavaScript components के आसपास खेल रहा हूं।

जब मैं मोडल संवाद को ट्रिगर करता हूं, जबड़े पृष्ठ में अगले लिंक पर जाने वाले मोडल को छोड़ देता है।

क्या एक सुलभ मोडल लागू करने का कोई तरीका है?

मुझे लगता है कि एक और समाधान मोडल की कार्यक्षमता के लिए एक स्थिर पृष्ठ बनाना है, और जब उपयोगकर्ता स्क्रीन रीडर का उपयोग करता है तो इस पृष्ठ पर रीडायरेक्ट करना है। क्या उपयोगकर्ता किसी भी तरह से पता लगा सकता है यदि उपयोगकर्ता स्क्रीन रीडर का उपयोग कर रहा है?

Answer 1

यहाँ एक सुलभ मॉडल संवाद है।

http://irama.org/web/dhtml/lightbox/ विवरण इस तरह के एक सुलभ कार्यान्वयन (लाइटबॉक्स और एक मोडल संवाद के बीच थोड़ा अंतर है, महत्वपूर्ण बात मोडल भाग और कीबोर्ड प्रबंधन है)।
आप में भी पढ़ सकते हैं डीएचटीएम स्टाइल गाइडdialog modal भाग और W3C/WAI-ARIA Making a Dialog Modal की अनौपचारिक प्रति।

जे। वाजबर्ग ने एक और DIY दृष्टिकोण की आवश्यकता होने पर trap the keyboard input inside a DOM element में एक jQuery प्लगइन लिखा।

Answer 2

यदि स्क्रीन स्क्रीन रीडर का उपयोग करने वाला उपयोगकर्ता स्वचालित रूप से पता लगाने के लिए कोई समाधान नहीं जानता है। लेकिन पृष्ठ की शुरुआत में एक लिंक छिपाने के लिए Google समाधान है (बाएं: -1000em और स्थिति: पूर्ण) जो सक्रिय हो सकता है यदि आप कीबोर्ड का उपयोग करते हैं और "विशेष मोड" प्रदर्शित करते हैं।

<a href="#" style="left:-1000em;position:absolute">Screen reader users, click here to turn off Google Instant.</a> 

संवाद html div पर एरिया और aria-परमाणु = "true" aria-लाइव = "मुखर" विशेषता का उपयोग करने के लिए अपने मॉडल संवाद कोशिश के लिए

। यह आपको संवाद बॉक्स की सामग्री की घोषणा करनी चाहिए। http://hanshillen.github.com/jqtest/#goto_dialog

एक बार मोडल सक्रिय होता है, कीबोर्ड नेविगेशन संवाद के अंदर फंस गया है जब तक यह स्पष्ट रूप से उपयोगकर्ता द्वारा बंद कर दिया गया है: