DIY ने पाद दिया

हर कोई जो पूरी तरह से साइट पृष्ठों के लिए उपयोग किया जाता है, वह पृष्ठ के पाद लेख के नीचे "नेक्ड" (चिपचिपा) लुक पसंद करता है। लेकिन इंटरनेट पर दो मुसीबतें हैं: इनपुट फ़ील्ड जो बड़े नहीं होते हैं और नॉन-बीटन (विंडो के निचले हिस्से) पाद के लिए होते हैं। उदाहरण के लिए, जब हम habrahabr.ru/settings/social जैसी छोटी ऊंचाई के पृष्ठ खोलते हैं, तो यह तुरंत उस आंख को पकड़ लेता है जो जानकारी दर्शक विंडो के निचले भाग में डिज़ाइन की जाती है, सामग्री से चिपक जाती है और कहीं बीच में, या खिड़की के शीर्ष पर भी होती है। जब नीचे खाली है।

उदाहरण के लिए, के बजाय ।
शुरुआती टाइपर्स के लिए यह ट्यूटोरियल दिखाएगा कि 45 मिनट में "नेस्टेड" फूटर कैसे बनाया जाए, जो कि आपके होनहार प्रोजेक्ट के निष्पादन के रूप में प्रतिस्पर्धा करने के लिए हैबर जैसे सम्मानजनक प्रकाशन की कमियों को भी ठीक करता है।

आइए, नेटवर्क से लिए गए एक प्रकार के नेल्ड फुटर के कार्यान्वयन को देखें, और समझने की कोशिश करें कि क्या हो रहा है। css-tricks.com/snippets/css/sticky-footer
सीएसएस:

* { margin:0; padding:0; } html, body, #wrap { height: 100%; } body > #wrap {height: auto; min-height: 100%;} #main { padding-bottom: 150px; } /* must be same height as the footer */ #footer { position: relative; margin-top: -150px; /* negative value of footer height */ height: 150px; clear:both;} /* CLEAR FIX*/ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix { height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ 

HTML:

 <div id="wrap"> <div id="main" class="clearfix"> </div> </div> <div id="footer"> </div> 

यह संभावना नहीं है कि जो कोई भी सीएसएस को जानता है, वह इस कोड को देख रहा है, सिद्धांतों को समझेगा और आत्मविश्वास से एक जटिल परियोजना को संपादित करेगा। साइड में कोई भी कदम साइड इफेक्ट को बढ़ावा देगा। नीचे दिए गए तर्क और पाद लेख को सीएसएस नियमों में अधिक जानकारी देने का इरादा है।

सिद्धांत से शुरू करते हैं

Nailed पाद लेख का सामान्य कार्यान्वयन अद्वितीय CSS2 की संपत्ति पर आधारित होता है, जो तत्व - BODY के तत्काल वंशज हैं - यदि विंडो में टैग उनके सभी माता-पिता की समान ऊँचाई हो, तो प्रतिशत ऊंचाई ( ऊँचाई: 100% या अन्य) को बनाए रखें, जो HTML टैग से शुरू होता है। पहले, बिना सिद्धांत के, और अब क्विरक्स मोड में, तत्वों की प्रतिशत ऊंचाइयों को किसी भी स्तर पर समर्थित किया जाता है, और आधुनिक सिद्धांत में केवल प्रतिशत-निर्दिष्ट तत्वों के अंदर होता है। इसलिए, यदि हम एक कंटेंट ब्लॉक बनाते हैं (चलो इसे #layout कहते हैं) जिसमें 100% ऊंचाई है, तो इसमें एक स्क्रॉल होगा, जैसे कि यह एक खिड़की थी। फूटर और शायद हेडर को छोड़कर सभी (स्ट्रीमिंग) सामग्री इसमें रखी गई है।

पाद को इस ब्लॉक के बाद रखा गया है और यह 0 पिक्सेल को उच्च बनाता है। सामान्य तौर पर, आप #layout के बाद जितने चाहें उतने ब्लॉक लगा सकते हैं, लेकिन उनमें से सभी या तो 0 पिक्सेल से ऊंचाई या दस्तावेज़ प्रवाह के बाहर होने चाहिए ( स्थिति नहीं : स्थिर )। और एक और महत्वपूर्ण चाल है जो आमतौर पर उपयोग की जाती है। ऊंचाई को 0. के बराबर बनाने के लिए आवश्यक नहीं है। आप ऊंचाई को निश्चित कर सकते हैं, लेकिन मार्जिन-नीचे संपत्ति के कारण इसे मुख्य इकाई से घटा सकते हैं : - (ऊंचाई); ।

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

चूँकि #layout ब्लॉक का निचला भाग एक पॉकेट है, यह पाद लेख के लिए खाली होना चाहिए, पृष्ठ ऑब्जेक्ट प्रदर्शित नहीं करना चाहिए। और यहां हम एक और प्रतिबंध के साथ मिलते हैं - हम #layout में पैडिंग के कारण खाली जेब नहीं बना सकते, क्योंकि तब यह 100% से अधिक हो जाएगा। मार्जिन भी नहीं बचाएगा - नेस्टेड तत्वों के गुणों के कारण खालीपन होना चाहिए। इसके अलावा, यह सुनिश्चित करना आवश्यक है कि अस्थायी तत्वों का ब्लॉक सीमा के नीचे नहीं चढ़ता है, जो किया जाता है, उदाहरण के लिए, एक ब्लॉक द्वारा

 <div class="clear"></div> 

जहाँ .clear {clear: दोनों} । यह महत्वपूर्ण है कि या तो यह " ऊंचाई " तय हो, या उसी रिश्तेदार इकाइयों में, या हम इसे पृष्ठ को बदलने की प्रक्रिया में गणना करेंगे। आमतौर पर इस समतल ब्लॉक को इसके लिए आवश्यक ऊंचाई निर्धारित करने के साथ संयोजित करना सुविधाजनक है।

आइए हमारे प्रयोगात्मक के पन्नों की संरचना को देखें। ऐसा करने का सबसे आसान तरीका क्रोम में फायरबग विंडो या समान विंडो (डेवलपर टूल (Ctrl-F12)) खोलना है।

 <!DOCTYPE html> <html xml:lang="ru" xmlns="http://www.w3.org/1999/xhtml"> <head> <body> <div id="topline">...  ...</div> <div id="layout"> <div id="header"> <div class="content_left">...=== ===...</div> <div class="sidebar_right">... ...</div> <div class="clear"></div> <!-- --> <div class="rotated_posts">...</div> <div id="footer"> <dl class="user">..<dl><!-- , --> <dl>...<dl> <dl>...<dl> <dl>...<dl> <dl>...</dl> <div class="copyright">...</div> </div> </div> <div id="AutocompleteContainter_ea125"></div> <!--  --> <div class="token-input-dropdown-hubs"></div> <div id="tiptip_holder" style="max-width:300px;"> <div id="jGrowl" class="top-right jGrowl"> </body> </html> 

चलिए काम के उदाहरण पर चलते हैं।

Nailed पाद लेख के प्रभाव के संदर्भ में लेआउट की कमियां क्या हैं? हम वही देखते हैं
1) साइट पर पाद आईडी / लेआउट के साथ ब्लॉक के अंदर है, जिसमें प्रतिशत की ऊंचाई नहीं है। सिद्धांत रूप में, वह, माता-पिता और सामग्री ब्लॉक .content-left को 100% ऊंचाई निर्धारित करने की आवश्यकता है। उत्तरार्द्ध के साथ, समस्याएं पैदा होती हैं - वह इसके लिए उपयुक्त नहीं है। इसलिए, एक इंटरलेयर ब्लॉक गायब है या फुटर उस स्तर पर नहीं है। इसके अलावा,
2) पाद की ऊंचाई चर है (यह सूची में तत्वों की संख्या और फ़ॉन्ट आकार पर निर्भर करता है, यह HTML से नहीं, बल्कि सीएसएस से देखा जा सकता है)। और
3) #layout के ऊपर 90px की एक निश्चित ऊंचाई की एक विज्ञापन इकाई है;
4) पाद लेख में कोई संरेखण ब्लॉक नहीं हैं, या (आमतौर पर बोलने वाला) #layout ब्लॉक में है (वहाँ है, लेकिन .rotated_posts ब्लॉक के ऊपर; हालाँकि, शायद इसे पाद लेख के लिए जिम्मेदार ठहराया जाना चाहिए)।

बिंदु 4 - एक स्क्रिप्ट खींचना होगा।
इसे जोड़कर तीसरे पैराग्राफ से निपटना सरल प्रतीत होगा

 #layout{margin-top:-90px;} 

लेकिन याद रखें कि यह ब्लॉक नहीं हो सकता है - यह बैनर काटने से दबा हुआ है, या विज्ञापनदाता अचानक इसे नहीं दिखाने का फैसला करते हैं। उस साइट पर कई पृष्ठ हैं जहां यह मौजूद नहीं है। इसलिए, विज्ञापन इकाई पर मार्जिन-टॉप की निर्भरता एक बुरा विचार है। इसे #layout के अंदर रखना बेहतर है - तब यह किसी भी चीज़ में हस्तक्षेप नहीं करेगा।

पहला बिंदु यह है कि सभी को काम करने के लिए नेल्ड फुटर के लिए, आपको फुटर ब्लॉक को #layout के नीचे रखना होगा । हालाँकि, जावास्क्रिप्ट का उपयोग करते हुए, आप अन्य नेस्टेड पाद योजनाओं को लागू कर सकते हैं, लेकिन किसी भी मामले में, आपको इसके बिना करने के लिए JS या सही लेआउट की आवश्यकता है।

चूँकि हम बहुत ही अंतिम वेबसाइट कोडर से मजबूत नहीं हो सकते हैं, सामग्री के अंदर पाद लेख "स्लैमिंग" कर सकते हैं, हम अपने भविष्य की साइट पर पाद लेख को सही ढंग से रखने के विचार को स्थगित कर देंगे (जो कि, इसलिए, हैबर की तुलना में "कूलर" होगा), और हम सही तरीके से एक जावास्क्रिप्ट (उपयोगकर्ता स्क्रिप्ट) के साथ हैबर तैयार करेंगे! राज्य। (ठीक है कहने दें, यह लेआउट डिजाइनर या स्विचमैन नहीं है जिसे दोष देना है, लेकिन साइट का रूप निश्चित रूप से, परियोजना प्रबंधन के रणनीतिक निर्णय को निर्धारित करता है।) इसलिए हम आदर्श को प्राप्त नहीं करेंगे, क्योंकि पहले दो या दो पेज गलत लेआउट के साथ लोड होंगे। लेकिन हमारे लिए, आईटी दुनिया की सबसे लोकप्रिय साइट की अवधारणा और गुणवत्ता को पार करने की क्षमता महत्वपूर्ण है।

इसलिए, स्क्रिप्ट में सही जगह पर (पहले, पृष्ठ लोड के अंत में), हम विज्ञापन के डोम-ब्लॉक और सही स्थानों पर पाद लेख लिखते हैं। (हम इस तथ्य के लिए तैयार होंगे कि उपयोगकर्ता स्क्रिप्ट के कारण समाधान शुद्ध से अधिक जटिल होगा।)

 var dQ = function(q){return document.querySelector(q);} //  var topL = dQ('#topline'), lay = dQ('#layout'), foot = dQ('#footer'); if(topL && lay) // -    lay.insertBefore(topL, lay.firstChild); if(lay && foot && lay.nextSibling) //  lay.parentNode.insertBefore(footer, lay.nextSibling); 

ब्लॉक को जगह में रखें - अब यह तत्वों को आवश्यक गुण आवंटित करने के लिए बनी हुई है। पाद लेख की ऊँचाई को ठीक-ठीक सेट करना होगा, बस इसलिए कि हम पहले से ही यह जानते हैं कि उपयोगकर्ता स्क्रिप्ट सक्रिय है (पेज लोडिंग का अंत)। उपयोगकर्ता-स्क्रिप्ट ट्रिगर बिंदु के कारण, जैसा कि ऊपर उल्लेख किया गया है, पृष्ठ पर एक पाद कूद अनिवार्य है। आप "अच्छा चेहरा" बनाने की कोशिश कर सकते हैं, लेकिन "बुरे खेल" के साथ? क्यों? साइट का "खराब गेम" आपको अतिरिक्त प्रयास के बिना एक अवधारणा बनाने की अनुमति देता है, जो गुणवत्ता का आकलन करने के लिए पर्याप्त होगा और आपकी परियोजना पर "सही गेम" के साथ इसकी आवश्यकता नहीं होगी।

 if(foot){ //- <div class="clear"></div>   h.apnd_el({clss:'clear', appendTo: footer}); var footH = foot.offsetHeight; //...    } if(topL && lay && footer && lay.nextSibling){ //      ("") h.apnd_el({clss:'clear', css:{height: (footH ||0) +'px'}, appendTo: lay}); lay.style.minHeight ='100%'; h.addRules('#layout{margin-bottom:-'+ footH +'px!important}html, body {height:100%}'); } 

यहां उन्होंने स्वयं लिखित फ़ंक्शन h.apnd_el का उपयोग करने की अनुमति दी, जो कि jQuery के समान ही है -

 $('<div class="clear"></div>').css({height: footH ||0}).appendTo($(footer)) 

और आगे - सीएसएस के नियमों के कार्यान्वयन का एक और विशिष्ट कार्य - h.addRules । यहां आप इसके बिना नहीं कर सकते, क्योंकि आपको " महत्वपूर्ण " के साथ एक नियम घोषित करने की आवश्यकता है - सिर्फ उपयोगकर्ता स्क्रिप्ट से शैली प्राथमिकताओं की ख़ासियत के कारण।

कोड के इन टुकड़ों के साथ, हम उपयोगकर्ता लिपि में (नीचे कूदने के बाद) नेल्ड फुटर देख सकते हैं और पूरी तरह से समझ सकते हैं कि पेज लेआउट कैसे बनाया जाए। हर रोज़ एक जंपिंग डिज़ाइन का उपयोग करना अप्रिय है, इसलिए, इसे केवल प्रदर्शन और परीक्षण के लिए बनाने की सिफारिश की जाती है। HabrAjax उपयोगकर्ता स्क्रिप्ट में, मैंने एक समान स्क्रिप्ट स्थापित की, इसे "अंडरफुटर" सेटिंग ("नीचे की ओर पैर किए जाने से पहले सेटिंग्स की सूची में एक" चेकमार्क "सेट) के साथ बंद करके, संस्करण 0.883-2012-09-12 के साथ शुरू किया।

यदि स्थापित है, तो nailed पैर ZenComment शैलियों को अद्यतन करने की आवश्यकता को प्रभावित करता है? हाँ, यह करता है। शैली प्राथमिकताओं की जटिल श्रृंखला के कारण, जिसमें उपयोगकर्ता स्क्रिप्ट द्वारा डाली गई शैलियों में सबसे कम प्राथमिकता है, हमें उपयोगकर्ता शैलियों को थोड़ा-थोड़ा समायोजित करने में सक्षम होना चाहिए ताकि वे किसी न किसी पाद लेख के साथ काम कर सकें। यदि आप उपयोगकर्ता शैलियों (2.66_2012-09-12 + तक) को अपडेट नहीं करते हैं, तो पाद सही ढंग से काम नहीं करेगा।

रोटेटेड_पोस्ट ब्लॉक (अतीत से तीन लोकप्रिय पोस्ट) पाद लेख के साथ अधिक तार्किक दिखता है, इसलिए वास्तविक स्क्रिप्ट में इसे पाद लेख में भी स्थानांतरित किया जाता है।

दूसरा आइटम (लेआउट दोषों की सूची से) शुद्ध रूप से हैबर के लिए तर्क दे रहा है (वे एक उपयोगकर्ता स्क्रिप्ट पर लागू नहीं होते हैं और आंशिक रूप से पिछले वाले दोहराते हैं)।

पृष्ठों को शुद्ध सीएसएस में एक नेल्ड फुटर बनाने से रोकने में समस्या है - ब्राउज़र में डिफ़ॉल्ट फ़ॉन्ट आकारों के आधार पर, अनिश्चितकालीन पाद ऊंचाई। CSS पर एक पाद लेख को कार्यान्वित करने के लिए, रिश्तेदार फ़ॉन्ट हाइट्स का चयन करना आवश्यक है, लेकिन उपयोगकर्ता के कंप्यूटर पर कोई फ़ॉन्ट उपलब्ध नहीं होने पर वे काम नहीं कर सकते हैं। इसलिए, समाधान में एक जावास्क्रिप्ट शामिल होना चाहिए जो पाद की अनुमानित स्थिति के लिए संक्रमण से मेल खा सकता है। या, विभिन्न प्लेटफार्मों पर उपयोगकर्ता स्क्रिप्ट पर किए गए निर्णय की स्वीकार्यता को देखते हुए, नेल्ड फूटर की गणना की गई स्थापना करने के लिए - पहली टिप्पणियों से पता चलता है कि समाधान व्यावहारिक है।

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

कार्यान्वयन

यदि आप HabrAjax 0.883+ को सक्षम करते हैं , तो हम "नेस्टेड पाद" का काम देखेंगे। यह स्क्रिप्ट का उपयोग करते हुए ऊंचाई में है। यह आपको मूल्यांकन करने की अनुमति देता है कि नियमित वाले की तुलना में नेल्ड फुटर के साथ बेहतर पृष्ठ कितने हैं। ZenComment उपयोगकर्ता शैलियाँ स्क्रिप्ट के साथ संगत हैं, लेकिन किसी न किसी पाद लेख के लिए उनके साथ ठीक से काम करने के लिए, आपको ZenComment संस्करण 2.66_2012-09-12 + इंस्टॉल करना होगा।

कार्यान्वयन व्यवहार तथ्य

पाद लेख, शैली और लिपियों के साथ शर्मिंदगी शर्मिंदगी है (केवल सिद्धांत द्वारा प्रबलित)। विभिन्न ब्राउज़रों में थोड़ा अलग व्यवहार होता है, लेकिन कुछ स्थानों पर - अप्रत्याशित। उपयोगकर्ता स्क्रिप्ट और ब्लॉकों के पुनर्व्यवस्था के बिना, परिणाम अलग-अलग होंगे। यहाँ उपयोगकर्ता स्क्रिप्ट पर कार्यान्वयन के साथ प्रयोग किए गए हैं।

1) फ़ायरफ़ॉक्स - फुटर जंप की अप्रत्याशित कमी। यह अजीब है कि वे वहां नहीं हैं - पाद को तल पर रखने के बाद प्रतिपादन होता है।

2) क्रोम - वह "भटक स्क्रॉल" से आश्चर्यचकित था - नीचे रिक्त स्थान पृष्ठ पर एक बार एक सेकंड की अवधि के साथ जोड़े जाते हैं - कुछ गलत ऊंचाइयों की गणना के साथ होता है। यह उपयोगकर्ता शैली में html, बॉडी {height: 100%} लिखकर इलाज किया जाता है, लेकिन बिना गारंटी के कि यह हमेशा काम करेगा। अधिक विश्वसनीय यह जांचने के लिए है कि क्या दस्तावेज़ ऊंचाई में खिड़की से अधिक नहीं है, और यदि यह अधिक नहीं है, तो पाद को स्थानांतरित करें, अन्यथा कुछ भी नहीं। एक छलांग के साथ - सब कुछ क्रम में है, यह है।

3) ओपेरा - पहले पेज लोड पर कोई जंप (v। 12.02) नहीं है, लेकिन जल्दबाजी में लोड करने से फुटर जंप दिखाई दे सकता है। बाकी एफएक्स की तुलना में कम सही नहीं है।

ठीक है, क्रोम को विशेष रूप से प्रशिक्षित करना आवश्यक है (स्क्रिप्ट के साथ) सही ढंग से व्यवहार करने के लिए और इस रूप में, समीक्षा के लिए संस्करण को रोल आउट करें। इसलिए, उपयोगकर्ता स्क्रिप्ट अनुभाग लेख में दिए गए की तुलना में थोड़ा अधिक जटिल है।

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

नतीजतन, यह कम से कम तेजी से स्थिर कंप्यूटरों के लिए पूरी तरह कार्यात्मक कार्य योजना बन गया। यदि गलत पाद लेख व्यवहार का पता लगाया जाता है, तो "अंडरफ़ूटर" सेटिंग को अक्षम किया जाना चाहिए।

यह किन पृष्ठों के लिए उपयोगी है?

एक मानक साइट पर, उपयोगकर्ता शैलियों के बिना, यहां तक ​​कि प्रश्नों और उत्तरों के छोटे पृष्ठ भी 1500px से अधिक लंबे हो जाते हैं, जो ज्यादातर मामलों में क्षैतिज रूप से स्थित मॉनिटर के साथ अपरिहार्य होते हैं। लेकिन साधारण मॉनिटर के साथ भी, लगभग 1300 पिक्सेल की ऊँचाई वाले उपयोगकर्ताओं के व्यक्तिगत पृष्ठ अक्सर पाए जाते हैं, जहाँ सभी विशिष्ट महिमा में नाबाद पाद दिखाई देता है। उपयोगकर्ता सेटिंग्स में बहुत लंबे और कई पेज नहीं हैं।

यदि आप ZenComment उपयोगकर्ता शैलियों का उपयोग करते हैं, तो वे आवश्यक पृष्ठ ऊंचाई को कम कर देते हैं, और HabrAjax उपयोगकर्ता स्क्रिप्ट साइडबार में कुछ या सभी ब्लॉक को नहीं दिखा सकती है। इसलिए, लिपियों और शैलियों के साथ, एक गैर-पीटा पाद का प्रभाव अधिक बार देखा जाता है। इसलिए, यह तर्कसंगत है कि HabrAjax में पाद लेख पहली बार दिखाई दिया। लेकिन एक नियमित साइट में कई पृष्ठ होते हैं जहां एक नेस्टेड पाद उपयोगी होगा।

क्या समर्थन होगा?

पिछले एक साल में साइट के व्यवहार से पता चलता है कि डेवलपर्स (और इसलिए, प्रबंधन) ने उन विशेषताओं को पेश करना शुरू कर दिया है जो पहले केवल उपयोगकर्ता स्क्रिप्ट और उपयोगकर्ता शैलियों में मौजूद थे। उदाहरण के लिए, वर्ष की शुरुआत में मैंने हैबर की प्रयोज्यता पर एक लेख समीक्षा लिखी , जहाँ मैंने कई छोटी-छोटी शुभकामनाएँ एकत्र कीं। छह महीने बाद, मैं उसके पास लौट आया और संतुष्टि के साथ नोट किया (सीधे पाठ में; आप "यूपीडी" और तारीखें पढ़ सकते हैं) कि कई विशेषताओं को वर्णित किया गया था जो कि साइट पर पहले से ही इच्छाएं लागू थीं।

अगला, टिप्पणियों का मूल्यांकन करने के लिए वर्गों के बजाय "तीर" को देखें। वे लगभग 3 साल पहले अलमलेक्सा ("प्रेटीफ़ायर") के उपयोगकर्ताओं में दिखाई दिए और लगभग 2 साल पहले उन्हें ज़ेनकॉम में स्थानांतरित किया गया था। लगभग 2-3 महीने पहले, वे साइट पर दिखाई दिए। यह माना जाने लगा है कि कुछ समय बाद तीर कुछ दूरी पर फैल जाएगा, जैसा कि ज़ेनकॉम (संख्या के बाईं ओर एक तीर, दूसरे से दाईं ओर) में किया जाता है ताकि कम याद किया जा सके।

इसलिए, शायद, हैबे पर "नेल्ड फुटर" उतना शानदार नहीं है जितना कि लगभग 3 साल पहले लग सकता था।

पिछले 3 महीनों में दिखाई देने वाली HabrAjax स्क्रिप्ट की अन्य विशेषताएं (सेटिंग्स में अक्षम हैं):
* ऑटोस्टैट इनपुट फ़ील्ड (ओपेरा में बड़े पाठ में धीमा हो सकता है);
* "आज" और "कल" ​​के अलावा अन्य तारीखों के साथ सप्ताह के दिन;
* टेप में घटनाएँ, 1 पंक्ति और 2 वर्णों के समीपस्थ ;
* "हबर *" शब्दों का संक्षिप्त नाम "and ·" और ";α";
* लेख संख्याओं के लिए तारीख संकेत - यह बताया गया है कि लेख किस महीने और वर्ष से पहले डाउनलोड किया गया था, URL में संख्या द्वारा;
* 2 शब्दों के लिए "समान पोस्ट" कम से कम । पॉप-अप "समान पोस्ट" का स्क्रीनशॉट (12 लिंक दिखाता है, 4 नहीं)।