قورال قوراللىرى سىزدە بار بولغان ئەڭ كىچىك UI مەسىلىسىدەك ھېس قىلىدۇ. ئۇلار كىچىك ھەم ئادەتتە يوشۇرۇن. بەزىلەر قانداق قۇرۇشنى سورىغاندا ، ئەنئەنىۋى جاۋاب دائىم دېگۈدەك بىر قىسىم JavaScript كۈتۈپخانىسىنى ئىشلىتىپ قايتىپ كېلىدۇ. ئۇزاقتىن بۇيان ، بۇ ئاقىلانە مەسلىھەت ئىدى. مەنمۇ ئۇنىڭغا ئەگەشتىم. سىرتقى كۆرۈنۈشتە ، قورال قوراللىرى ئاددىي. مەلۇم بىر ئېلېمېنتنى يۆتكەڭ ياكى مەركەزلەشتۈرۈڭ ، بەزى تېكىستلەر بىلەن كىچىك قۇتىنى كۆرسىتىڭ ، ئاندىن ئىشلەتكۈچى يىراقلاشقاندا ئۇنى يوشۇرۇڭ. ئەمما ھەقىقىي ئىشلەتكۈچىلەرگە بىرنى ئەۋەتسىڭىز ، قىرلىرى كۆرۈنۈشكە باشلايدۇ. كۇنۇپكا تاختىسى ئىشلەتكۈچىلەر Tab نى قوزغىتىدۇ ، ئەمما قورال قوراللىرىنى ھەرگىز كۆرمەيدۇ. ئېكران ئوقۇرمەنلىرى ئۇنى ئىككى قېتىم ئېلان قىلىدۇ ، ياكى ھەرگىز بولمايدۇ. چاشقىنەكنى بەك تېز يۆتكىگەندە قورال قوراللىرى لەپىلدەپ تۇرىدۇ. ئۇ كىچىك ئېكرانلاردىكى مەزمۇنلارنى قاپلايدۇ. Esc نى باسسىڭىز ئۇنى تاقىمايدۇ. فوكۇس يوقىلىدۇ. ۋاقىتنىڭ ئۆتۈشىگە ئەگىشىپ ، مېنىڭ قورال كودى مېنىڭ ھەقىقىي ئىگىدارچىلىق قىلىشنى خالىمايدىغان نەرسىگە ئايلاندى. پائالىيەت ئاڭلىغۇچىلار دۆۋىلىنىپ كەتتى. يۆتكىلىش ۋە فوكۇسنى ئايرىم بىر تەرەپ قىلىش كېرەك ئىدى. سىرتتا چېكىش ئالاھىدە ئەھۋاللارغا ئېھتىياجلىق. ARIA خاسلىقى قولدا ماس قەدەمدە ساقلىنىشى كېرەك ئىدى. ھەر بىر كىچىك ئوڭشاش يەنە بىر قەۋەت لوگىكا قوشتى. كۈتۈپخانىلار ياردەم قىلدى ، ئەمما ئۇلارمۇ پەردە ئارقىسىدا نېمە ئىش بولغانلىقىنى تولۇق چۈشىنىشنىڭ ئورنىغا ، مەن ئىشلىگەن قارا قۇتىلارغا ئوخشايتتى. بۇ مېنى يېڭى Popover API نى كۆرۈشكە ئۈندىدى. ئەگەر كۇتۇپخانىنىڭ ياردىمىسىز توركۆرگۈچنىڭ يەرلىك مودېلىنى ئىشلىتىپ بىر قورال قورالنى قايتا قۇرسام نېمە ئىشلارنىڭ يۈز بېرىدىغانلىقىنى كۆرگۈم كەلدى. باشلىغاندا ، دىققەت قىلىشقا ئەرزىيدىغىنى شۇكى ، ھەر قانداق يېڭى ئىقتىدارغا ئوخشاش ، ئۇنىڭدا بەزى ئىشلار يەنىلا دەزماللىنىۋاتىدۇ. دېمەك ، ئومۇمىي API غا ئېقىۋاتقان بىر قانچە پارچە بولسىمۇ ، ئۇ ھازىر توركۆرگۈچنىڭ قوللىشىغا ئېرىشتى. بۇ ئارىلىقتا كانيۇسنى كۆزىتىپ تۇرۇشقا ئەرزىيدۇ. «كونا» قورال قوراللىرى Popover API دىن بۇرۇن ، قورال ئامبىرىنى ئىشلىتىش تېزلەتمە ئەمەس ئىدى. بۇ سۈكۈتتىكى ھالەتتە. توركۆرگۈچلەردە چاشقىنەك ، كۇنۇپكا تاختىسى ۋە ياردەمچى تېخنىكىلاردا ئىشلەيدىغان قورال قوراللىرى ھەققىدە يەرلىك ئۇقۇم يوق. ئەگەر سىز توغرا بولۇشقا كۆڭۈل بۆلسىڭىز ، سىزنىڭ بىردىنبىر تاللىشىڭىز كۇتۇپخانا ئىشلىتىش ئىدى ، بۇ مېنىڭ قىلغان ئىشىم. يۇقىرى سەۋىيىدە ، ئەندىزە ھەمىشە ئوخشاش ئىدى: قوزغىتىش ئېلېمېنتى ، يوشۇرۇن قورال ئېلېمېنتى ۋە JavaScript بۇ ئىككىسىنى ماسلاشتۇرىدۇ.
كۈتۈپخانىدا ئېلېمېنتنىڭ ئايلىنىش ياكى فوكۇس توغرىلاش ، تۇتۇق ياكى چاشقىنەكنىڭ يوچۇقىغا يوشۇرۇنۇش ۋە سىيرىلما ئورنىنىڭ چوڭ-كىچىكلىكىنى ئۆزگەرتىشكە بولىدىغان سىم سىم بىر تەرەپ قىلىندى.
ۋاقىتنىڭ ئۆتىشىگە ئەگىشىپ ، قورال قوراللىرى نازۇك بولۇپ قېلىشى مۇمكىن. كىچىك ئۆزگىرىشلەر خەتەر ئېلىپ كەلدى. كىچىككىنە ئوڭشاش چېكىنىشنى كەلتۈرۈپ چىقاردى. تېخىمۇ چاتاق يېرى ، يېڭى قورال قوراللىرىنى قوشۇش ئوخشاش مۇرەككەپلىككە ۋارىسلىق قىلدى. ئىشلار تېخنىكىلىق ئىشلىدى ، ئەمما ئەزەلدىن مۇقىم ياكى تولۇق ھېس قىلمىدى. مەن توركۆرگۈنىڭ يەرلىك Popover API ئارقىلىق قورال قوراللىرىنى قايتا قۇرۇشنى قارار قىلغىنىمدا بۇ ئەھۋال ئىدى. مەن Popover API نى سىناپ باققان پەيت مەن يېڭى نەرسىلەرنى سىناق قىلىپ باقماقچى بولغانلىقىم ئۈچۈن Popover API نى ئىشلىتىشكە ئۆزگەرمىدىم. مەن توركۆرگۈ ئاللىقاچان چۈشىنىشى كېرەك دەپ قارىغان قورال قورال ھەرىكىتىنى ساقلاپ زېرىككەنلىكىم ئۈچۈن ئالماشتۇردۇم. مەن دەسلەپتە گۇمانلاندىم. كۆپىنچە يېڭى تور API لىرى ئاددىيلىقنى ۋەدە قىلىدۇ ، ئەمما يەنىلا سىز قاچماقچى بولغان مۇرەككەپلىكنى جىمجىت ھالدا ئەسلىگە كەلتۈرىدىغان يېلىم ، گىرۋەكنى بىر تەرەپ قىلىش ياكى خاتالىق لوگىكىسىنى تەلەپ قىلىدۇ. شۇڭا ، مەن ئەڭ كىچىك ئۇسۇلدا Popover API نى سىناپ باقتىم. تۆۋەندىكىسى:
غا ئۇلىنىدۇ <كۇنۇپكا popovertarget = "tip-1">?
بۇ كۇنۇپكا پايدىلىق تەكلىپنى قوزغىتىدۇ.
