Tilmaamaha qalabku waxay dareemayaan sida dhibaatada UI ee ugu yar ee aad yeelan karto. Way yaryar yihiin oo inta badan waa qarsoon yihiin. Marka qof weydiiyo sida loo dhiso mid, jawaabta dhaqameedku had iyo jeer way soo noqotaa iyada oo la adeegsanayo qaar ka mid ah maktabadda JavaScript. Oo muddo dheer, taasi waxay ahayd talada macquulka ah. Anigana waan raacay. Dusha sare, tilmaanta qalabku waa mid fudud. Dul bood ama diiradda saar shay, tus sanduuq yar oo qoraal ah, dabadeed qari marka isticmaaluhu ka guuro. Laakiin marka aad u soo rarto mid ka mid ah isticmaaleyaasha dhabta ah, cidhifyadu waxay bilaabaan inay muujiyaan. Isticmaalayaasha kiiboodhka tab ee kiciya, laakiin waligood ha arkin aaladda. Akhristayaasha shaashadda waxay ku dhawaaqaan laba jeer, ama maya dhammaan. Qalabka cidhifku wuu libiqsadaa marka aad si degdeg ah u dhaqaajiso jiirka. Waxay ku dul wareegaysaa waxa ku jira shaashado yaryar. Cadaadiska Esc ma xidho Diiradadu way luntay Muddo ka dib, koodka qalabkaygu wuxuu koray wax aanan runtii rabin inaan mar dambe lahaado. Dhagaystayaashii xaflada ayaa is urursaday. Hover iyo diiradda waxay ahayd in si gaar ah loo maareeyo. Dhagsi ka baxsan ayaa loo baahday kiisas gaar ah. Sifooyinka ARIA waxay ahayd in gacanta lagu hayo si isku mid ah. Qalab kasta oo yar wuxuu ku daray lakab kale oo macquul ah. Maktabadaha ayaa caawiyay, laakiin sidoo kale waxay u ekaayeen sanduuqyo madow oo aan ka shaqeeyay agagaarka halkii aan si buuxda u fahmi lahaa waxa ka dhacaya muuqaallada gadaashiisa. Taasi waa waxa igu riixay inaan eego Popover API-ga cusub. Waxaan rabay inaan arko waxa dhici doona haddii aan dib u dhiso hal qalab oo keliya anigoo isticmaalaya qaabka browserka ee qaabka asalka ah iyada oo aan la helin kaalmada maktabadda. Sida aan ku bilowno, waxaa habboon in la ogaado in, sida muuqaal kasta oo cusub, ay jiraan waxyaabo la mid ah oo weli la sii daayo. Taasi waxay tidhi, waxay hadda ku raaxaysataa taageerada browserka weyn, in kasta oo ay jiraan qaybo badan oo API-ga guud ah oo qulqulaya. Waxaa habboon in isha lagu hayo Caniuse inta lagu guda jiro. Qalabkii hore ee "Old". Kahor API Popover, adeegsiga maktabadda aaladda ma ahayn marin-gaab. Waxay ahayd default. Darowsaruhu ma lahayn fikradda asalka ah ee aaladda ka shaqeysa guud ahaan jiirka, kiiboodhka, iyo tignoolajiyada caawinta. Haddii aad danaynayso saxnaanta, ikhtiyaarkaada kaliya ayaa ahaa inaad isticmaasho maktabad, waana taas runtii waxa aan sameeyay. Heer sare, hannaankii had iyo jeer isku mid buu ahaa: curiye kiciya, curiye qalab qarsoon, iyo JavaScript si loo isku xidho labada.
Maktabadu waxay wax ka qabatay fiilooyinka u oggolaanaya cunsurku inuu muujiyo dullid ama foojignaan, ku qariyo blur ama fasaxa jiirka, oo dib u habeeyo/ cabbiro duubista.
Waqti ka dib, qalabku wuxuu noqon karaa mid jilicsan. Isbeddellada yaryar waxay qaadeen khatar. Hagaajin yaryar ayaa keenay dib u dhac. Ka sii darane, ku darista qalab cusub waxay dhaxashay kakanaanta isku midka ah. Arrimuhu farsamo ahaan way shaqeeyeen, laakiin weligood ma dareemin degenaansho ama dhammaystiran. Taasi waxay ahayd xaalada markii aan go'aansaday in aan dib u dhiso qalabka wax lagu qoro aniga oo isticmaalaya browserka Popover API. Daqiiqadii aan isku dayay Popover API Uma wareegin isticmaalka Popover API sababtoo ah waxaan rabay inaan tijaabiyo wax cusub. Waan bedelay sababtoo ah waan ka daalay ilaalinta habdhaqanka qalabaynta oo aan rumaysnaa in browserku uu hore u fahmay. Markii hore waan ka shakiyay. Inta badan API-yada cusubi waxay ballan qaadaan fudayd, laakiin wali waxay u baahan yihiin xabag, gacan-ku-haynta kiiska, ama caqli-celinta dib-u-dhaca taasoo si aamusnaan ah u abuurta kakanaantaada aad isku dayday inaad ka baxsato. Markaa, waxaan isku dayay Popover API sida ugu yar ee suurtogalka ah. Waa kan sida ay taasi u ekayd:
1. Kiiboodhka "Kaliya wuu shaqeeyaa" Taageerada kiiboodhka waxay ku xidhan tahay lakabyo badan oo si sax ah u safan: diirada waxay ahayd inay kiciso aaladda, blur waxay ahayd inay qariso, Esc waxay ahayd in gacanta lagu xidho, waqtiguna waa muhiim. Haddii aad seegtay hal kiis oo cidhif ah, tip-tip-ku waxay ahaan doontaa mid aad u dheer ama way baaba'aysaa ka hor inta aan la akhriyin. Iyada oo sifada popover loo dhigay auto ama buug-gacmeed, browserku wuxuu la wareegayaa aasaaska: Tab iyo Shift+Tab waxay u dhaqmaan si caadi ah, Esc waxay xirtaa tibaaxaha aaladda mar kasta, loomana baahna dhageystayaal dheeri ah.
Waxa ka lumay codebase waxay ahaayeen kuwa gacanta ku haya furayaasha caalamiga ah, caqli-celinta nadiifinta gaarka ah ee Esc, iyo jeegag dawladeed inta lagu guda jiro socodka kiiboodhka. Khibradda kiiboodhka waxay joojisay inay noqoto wax aan ku qasbanaado inaan ilaaliyo, waxayna noqotay dammaanad browserka. 2. Saadaalinta Screenreader Tani waxay ahaydhorumarka ugu weyn. Xitaa iyada oo si taxadar leh loo shaqeeyo ARIA, dabeecaddu way kala duwan tahay, sidaan hore u soo sheegay. Isbeddel kasta oo yar wuxuu dareemay khatar. Isticmaalka popover oo leh door ku habboon waxay u egtahay oo dareemaysaa xasillooni badan oo la saadaalin karo illaa iyo waxa dhici doona:
Oo halkan waa guul kale: beddelka ka dib, Lighthouse wuxuu joojiyay calaamadinta digniinaha gobolka ARIA ee khaldan ee isdhexgalka, sababtoo ah ma jiraan gobolo ARIA ah oo caado ah oo aan si qalad ah u khaldamo.
3. Maaraynta diiradda Diiradadu waxay ahaan jirtay mid jilicsan. Ka hor, waxaan lahaa xeerar ay ka mid yihiin: U ogolow diiradda in uu kiciyo tusmada qalabka, u guuri diiradda qalabka oo ha xirin, kicin kicin marka ay aad u dhowdahay, iyo xir qalabka oo soo celi diiradda si gacanta ah. Tani waxay shaqeysay ilaa aysan dhicin. Iyada oo la adeegsanayo Popover API, biraawsarku waxa uu xoojinayaa qaab ka fudud halkaas oo diiradda si dabiici ah ugu dhaqaaqi karto popover. Xiritaanka popover-ka waxay ku soo celisaa diiradda kicinta, mana jiraan dabinno diiradda oo aan muuqan ama daqiiqado diiradda la saaray. Oo anigu kuma darin koodhka soo celinta diiradda; Waan ka saaray.
Gabagabo Popover API waxay ka dhigan tahay in aaladaha aaladaha aysan hadda ahayn wax aad matasho. Waa wax browserku fahmayo. Furitaanka, xidhidhiyaha, habdhaqanka kiiboodhka, maaraynta baxsadka, iyo qayb wayn oo gelitaanku hadda waxay ka yimaadaan goobta lafteeda, ee kama iman JavaScript ad-hoc. Taas macnaheedu maaha in maktabadaha qalabku ay duugoobeen sababtoo ah wali waxay macno u samaynayaan nidaamyada naqshadaynta adag, wax ka beddelka culus, ama caqabadaha dhaxalka ah, laakiin asal ahaan waa beddelay. Marka ugu horeysa, qalabka ugu fudud ayaa sidoo kale noqon kara midka ugu saxsan. Haddii aad xiisaynayso, isku day tijaabadan: Kaliya ku beddel hal qalab oo alaabtaada ah Popover API, wax walba ha qorin, ha guurin nidaam dhan, oo kaliya mid qaado oo arag waxa ka lumaya koodkaaga. Marka madalku ku siiso horudhac wanaagsan, guushu maaha kaliya khadadka JavaScript ka yar, laakiin waa waxyaabo yar oo ay tahay inaad ka walwasho gabi ahaanba. Fiiri koodhka isha oo buuxa ee ku jira GitHub repo. Akhris Dheeraad ah Si aad u qoto dheer ugu quusato popovers iyo API-yada la xidhiidha:
"Poppin' In", Geoff Graham "Caddaynta xidhiidhka ka dhexeeya Popovers iyo Dialogs", Zell Liew "Waa maxay popover= tilmaan?", Una Kravets "Amarrada soo-qaadista", Daniel Schwarz "Abuuritaanka Ogeysiinta Xiritaanka Tooska ah ee leh HTML Popover", Preethi Fur UI Popover API Explainer "Ku soo booda (kor) buufinnada", John Rhea "Mawqifka CSS Anchor", Juan Diego Rodríguez
MDN waxay kaloo bixisaa dukumeenti farsamo oo dhamaystiran oo loogu talagalay Popover API.
