टूलटिप आपके सबसे छोट यूआई समस्या निहन लागेला। ई छोट-छोट होलें आ आमतौर पर छिपल होलें. जब केहू पूछेला कि कइसे बनावल जाला त पारंपरिक जवाब लगभग हमेशा कवनो जावास्क्रिप्ट लाइब्रेरी के इस्तेमाल से वापस आ जाला. आ बहुत दिन ले इहे समझदार सलाह रहे। हमहूँ एकर पालन कइनी। ऊपर से देखल जाव त टूलटिप सरल होला. कवनो तत्व पर होवर भा फोकस करीं, कुछ टेक्स्ट वाला एगो छोट बॉक्स देखाईं, फिर जब यूजर दूर हो जाई त ओकरा के छिपाईं। बाकिर एक बेर रउरा एगो के असली यूजर्स के भेज दिहनी त किनारा लउके लागेला. कीबोर्ड यूजर ट्रिगर में टैब करीं, लेकिन टूलटिप के कबो ना देखीं। स्क्रीन रीडर दू बेर एकर एलान करेलें, भा बिल्कुल ना. जब रउआ माउस के बहुत जल्दी हिलावेनी त टूलटिप झिलमिल जाला। ई छोट-छोट स्क्रीन पर सामग्री के ओवरलैप करेला। Esc दबावे से एकरा के बंद ना होखे। फोकस भटक जाला। समय के साथे हमार टूलटिप कोड बढ़ के एगो अइसन चीज बन गइल जवना के हम अब सही मायने में मालिक ना बनल चाहत रहीं. आयोजन श्रोता लोग के ढेर लागल। होवर आ फोकस के अलगा से संभाले के पड़ी. बाहर के क्लिक खातिर स्पेशल केस के जरूरत रहे। एआरआईए के विशेषता के हाथ से सिंक में रखे के पड़ी। हर छोट-छोट फिक्स से तर्क के एगो अउरी परत जोड़ल जात रहे। लाइब्रेरी मदद कइलस, बाकिर ऊहो पर्दा के पीछे का हो रहल बा ओकरा के पूरा तरह से समझे के बजाय हम काम करत ब्लैक बॉक्स जइसन अधिका रहे। इहे हमरा के नया पोपोवर एपीआई के देखे खातिर धकेल दिहलस। हम देखल चाहत रहनी कि अगर हम कवनो लाइब्रेरी के सहायता के ब्राउजर के नेटिव मॉडल के इस्तेमाल करत कवनो एक टूलटिप के फेर से बना दीं त का होई. जइसे-जइसे हमनी के शुरुआत करत बानी जा, इहाँ इहो जानल जरूरी बा कि, जईसे कि कवनो नाया फीचर के संगे होखेला, एकरा संगे कुछ अयीसन चीज़ बा जवना के अभी तक इस्त्री कईल जाता। कहल जाला कि फिलहाल एकरा के बहुत बढ़िया ब्राउजर सपोर्ट मिलेला, हालांकि समग्र एपीआई के कई गो टुकड़ा बा जवन कि फ्लक्स में बा। एह बीच कैनियस पर नजर राखल लायक बा. “पुरनका” टूलटिप के बारे में बतावल गइल बा पोपोवर एपीआई से पहिले टूलटिप लाइब्रेरी के इस्तेमाल कवनो शॉर्टकट ना रहे। इ डिफ़ॉल्ट रहे। ब्राउजर में अइसन टूलटिप के मूल अवधारणा ना रहे जवन माउस, कीबोर्ड, आ सहायक तकनीक के पार काम करे. अगर रउरा सहीता के परवाह रहे त राउर एकमात्र विकल्प रहे कि लाइब्रेरी के इस्तेमाल करीं आ हम ठीक वइसने कइनी. उच्च स्तर पर पैटर्न हमेशा एकही रहे: एगो ट्रिगर तत्व, एगो छिपल टूलटिप तत्व आ दुनों के समन्वय करे खातिर जावास्क्रिप्ट।

के बा

लाइब्रेरी ओह वायरिंग के संभालत रहे जवना से तत्व होवर भा फोकस पर देखावे, ब्लर भा माउस छोड़ला पर छिपल आ स्क्रॉल पर रिपोजिशन/रिसाइज करे के इजाजत देत रहे.

समय के संगे टूलटिप नाजुक हो सकता। छोट-छोट बदलाव से जोखिम होखत रहे। छोट-मोट फिक्स के चलते रिग्रेशन भईल। एकरा से भी बुरा बात ई बा कि नया टूलटिप जोड़ला से भी उहे जटिलता विरासत में मिलल। तकनीकी रूप से बात काम कइलस, बाकिर कबो बसल भा पूरा ना लागल. जब हम ब्राउजर के मूल पोपोवर एपीआई के इस्तेमाल से टूलटिप के फेर से बनावे के फैसला कइनी त हालात अइसने रहे. जवना पल हम पोपोवर एपीआई के कोशिश कइनी हम पोपोवर एपीआई के इस्तेमाल में ना बदलनी काहे कि हम कुछ नया प्रयोग कइल चाहत रहीं. हम एह से स्विच कइनी काहे कि हम टूलटिप के व्यवहार बना के राखत थाक गइल रहीं जवना के हमरा मानना ​​रहे कि ब्राउजर के पहिलहीं से समझे के चाहीं. हमरा त पहिले त संदेह रहे। अधिकतर नया वेब एपीआई सभ सादगी के वादा करे लें, बाकी फिर भी गोंद, एज-केस हैंडलिंग, या फॉलबैक लॉजिक के जरूरत होला जे चुपचाप ओही जटिलता के दोबारा पैदा करे जेवना से रउआँ बचे के कोसिस करत रहनी। त, हम पोपोवर एपीआई के छोट से छोट तरीका से आजमा के देखनी। इहाँ त ऊ कइसन लागत रहे:

के कनेक्शन बनावेला <बटन popovertarget="tip-1">? के बा

इ बटन एगो मददगार टिप के ट्रिगर करेला।
के बा

1. कीबोर्ड “बस काम करेला” कीबोर्ड के सपोर्ट कई गो लेयर सभ के सही तरीका से लाइनिंग करे पर निर्भर करे ला: फोकस के टूलटिप के ट्रिगर करे के पड़े ला, ब्लर के एकरा के छिपावे के पड़े ला, Esc के मैन्युअल रूप से तार लगावे के पड़े ला आ समय महत्व के रहे। अगर रउआँ एगो एज केस से चूक गइल बानी त टूलटिप या त बहुत देर ले खुलल रही या पढ़े से पहिले गायब हो जाई। पॉपओवर एट्रिब्यूट के ऑटो भा मैनुअल पर सेट कइला पर ब्राउजर बेसिक सभ के अपना हाथ में ले लेला: टैब आ शिफ्ट+टैब सामान्य तरीका से व्यवहार करे लें, Esc हर बेर टूलटिप बंद क देला, आ कौनों अतिरिक्त श्रोता के जरूरत ना पड़े ला।

के बा सहायक सफाई दिहल गइल बा
के बा

हमरा कोडबेस से जवन गायब भइल ऊ रहे ग्लोबल कीडाउन हैंडलर, Esc-स्पेसिफिक क्लीनअप लॉजिक, आ कीबोर्ड नेविगेशन के दौरान स्टेट चेक. कीबोर्ड के अनुभव कुछ अइसन होखल बंद हो गइल जवना के हमरा रखरखाव करे के रहे, आ ई ब्राउजर के गारंटी बन गइल. 2. स्क्रीनरीडर के पूर्वानुमान के क्षमता इहे रहे कि...सबसे बड़ सुधार भइल बा. सावधानी से एरिया के काम से भी व्यवहार अलग-अलग रहे, जईसे कि हम पहिले रेखांकित कईले रहनी। हर छोट-मोट बदलाव जोखिम भरल लागत रहे। उचित भूमिका वाला पॉपओवर के इस्तेमाल बहुत अधिक स्थिर आ पूर्वानुमानित लउकेला आ महसूस होला जहाँ तक कि का होखे वाला बा:

सहायक सफाई दिहल गइल बा
के बा

आ इहाँ एगो अउरी जीत बा: स्विच के बाद लाइटहाउस बातचीत खातिर गलत एआरआईए स्टेट चेतावनी के फ्लैग कइल बंद कर दिहलस, एकर बहुत हद तक कारण बा कि अब हमरा खातिर गलती से गलत होखे खातिर कस्टम एआरआईए स्टेट नइखे रहि गइल।

3. फोकस प्रबंधन के बारे में बतावल गइल बा पहिले फोकस नाजुक होखत रहे। पहिले हमरा लगे अइसन नियम रहे जइसे कि: फोकस ट्रिगर के टूलटिप देखावे दीं, फोकस के टूलटिप में ले जाईं आ बंद मत करीं, जब बहुते नजदीक होखे त ट्रिगर के धुंधला करीं, आ टूलटिप बंद क के फोकस मैन्युअल रूप से रिस्टोर करीं. ई तबले काम कइल जबले ना भइल. पोपोवर एपीआई के साथ ब्राउजर एगो सरल मॉडल के लागू करे ला जहाँ फोकस अउरी स्वाभाविक रूप से पॉपओवर में जा सके ला। पॉपओवर बंद कइला से फोकस ट्रिगर पर वापस हो जाला, आ कवनो अदृश्य फोकस ट्रैप भा खोवल फोकस मोमेंट ना होला. आ हम फोकस रिस्टोरेशन कोड ना जोड़नी; हम ओकरा के हटा दिहनी।

निष्कर्ष निकलल बा पोपोवर एपीआई के मतलब बा कि टूलटिप अब अइसन चीज नइखे रहि गइल जवना के रउरा सिमुलेट करीं. ऊ लोग अइसन चीज ह जवना के ब्राउजर समझ में आवेला. खुलल, बंद कइल, कीबोर्ड व्यवहार, एस्केप हैंडलिंग, आ एक्सेसबिलिटी के एगो बड़हन हिस्सा अब खुद प्लेटफार्म से आवेला, एड-हॉक जावास्क्रिप्ट से ना. एकर मतलब ई ना होला कि टूलटिप लाइब्रेरी सभ अप्रचलित बाड़ी सऽ काहें से कि ई अबहिन ले जटिल डिजाइन सिस्टम, भारी कस्टमाइजेशन, या विरासत के बाधा खातिर समझ में आवे लीं, बाकी डिफ़ॉल्ट शिफ्ट हो गइल बा। पहिला बेर सबसे सरल टूलटिप भी सबसे सही हो सकेला। अगर रउआँ उत्सुक बानी त ई प्रयोग आजमाईं: बस अपना प्रोडक्ट में खाली एगो टूलटिप के पोपोवर एपीआई से बदल दीं, सब कुछ दोबारा मत लिखीं, पूरा सिस्टम के माइग्रेट मत करीं, आ बस एगो चुनीं आ देखीं कि रउआँ के कोड से का गायब हो जाला। जब प्लेटफार्म रउरा के बेहतर प्रिमिटिव देला त जीत खाली जावास्क्रिप्ट के कम लाइन ना होला बलुक ई कम चीज होला जवना के चिंता रउरा बिल्कुल करे के पड़ेला. हमार गिटहब रेपो में पूरा स्रोत कोड देखीं। आगे पढ़ल जा सकेला पॉपओवर आ संबंधित एपीआई सभ में गहिराह गोता लगावे खातिर:

“पॉपिन’ इन”, जॉफ ग्राहम के नाम से जानल जाला “पोपोवर आ संवाद के बीच संबंध के स्पष्ट कइल”, जेल लियू “पोपोवर=संकेत का होला?”, उना क्रावेट्स “इन्वोकर कमांड”, डेनियल श्वार्ज के ह “एचटीएमएल पोपोवर के साथ ऑटो-क्लोजिंग नोटिफिकेशन बनावल”, प्रीठी यूआई पोपोवर एपीआई एक्सप्लेनर खोलीं “पॉप(ओवर) द बैलून”, जॉन रिया के ह “सीएसएस एंकर पोजीशनिंग”, जुआन डिएगो रोड्रिग्ज के ह

एमडीएन पोपोवर एपीआई खातिर व्यापक तकनीकी दस्तावेजीकरण भी देला।

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free