Selectik - स्टाइलिश चयन

वेब डिजाइनर स्टाइलिंग मानक रूप तत्वों से प्यार करते हैं। फिर हमें इन तत्वों को लागू करना होगा - कोडर।

दर्जनों परियोजनाओं के बाद जहां मुझे तीसरे पक्ष के समाधान का उपयोग करना था, मैं बैसाखी के निरंतर आविष्कारों के लिए तैयार था, तैयार-प्लग-इन के लचीलेपन की कमी और पीढ़ी की गति।

स्वाभाविक रूप से, इस सब के बाद, मैंने अपनी बाइक का आविष्कार करने का फैसला किया।

CSS3 का उपयोग करके अतिरिक्त छवियों के बिना उदाहरण विकसित किया गया था। सैंडबॉक्स डेमो पेज यहाँ है ।

फिर से बाइक?

लंबे समय तक मैंने लेखन समाप्त किया, तैयार-प्लग-इन का उपयोग करके बैसाखी का निर्माण किया। अंतिम पुआल तथ्य यह था कि यूनिट परीक्षण लिखते समय परीक्षक, मानक चयन के लिए, सबसे पहले, सबसे पहले पहुंचने की कोशिश करते हैं, लेकिन यह काम नहीं करता है, क्योंकि मैंने जिस प्लगइन्स का उपयोग किया था, उनमें से अधिकांश मानक चयन को "डिस्प्ले = कोई नहीं" के माध्यम से छिपाते थे।

मैं मूल समाधान की तरह काम करते हुए एक आसान समाधान, फास्ट जेनरेशन (IE में प्रति पेज बड़ी संख्या में चयन करना चाहता था) चाहता था।

जिन प्लगइन्स का मैंने सबसे अधिक उपयोग किया है, वे पहले से ही एक शैलीगत चयन की बनाई गई संरचना से संबंधित घटनाओं पर आधारित थे। Selectik के मामले में, घटनाओं को मुख्य रूप से मूल चयन पर लटका दिया जाता है।

पुस्तकालय ने दो कारणों से jQuery का उपयोग करने का निर्णय लिया:

• अब बनाई जा रही अधिकांश साइटें इस विशेष पुस्तकालय का उपयोग करती हैं।
• देशी जावास्क्रिप्ट पर, निर्माण में बहुत अधिक समय लगेगा और कोड की मात्रा छत के माध्यम से चली गई।

और इसलिए, Selectik क्या है?

लघु संस्करण में, स्क्रिप्ट फ़ाइल का वजन केवल 5.2 Kb है। और डेमो 12.8 Kb में एक अतिरिक्त प्लगइन (स्क्रॉल व्हील माउस) और सीएसएस के साथ। क्रमशः GZIP 2.1 Kb / 4.7 Kb।

समर्थित ब्राउज़र: IE7 +, क्रोम, सफारी, फ़ायरफ़ॉक्स के नवीनतम संस्करण।

वर्तमान में लागू की गई विशेषताएं:

• नियंत्रण ऊपर / नीचे और कुंजी दर्ज करें
• शैलीगत स्क्रॉल
• माउस व्हील स्क्रॉल
• वर्तनी खोज
• स्वचालित रूप से चौड़ाई समायोजित करता है
• "स्मार्ट स्थिति"
• Tab'om संक्रमण के लिए प्रतिक्रिया करता है

उपयोग किए जा सकने वाले पैरामीटर:

• सूची की चौड़ाई का असाइनमेंट (मानक मामले में, मूल सूची की चौड़ाई की गणना की जाती है)
• दृश्य तत्वों की अधिकतम संख्या
• स्क्रॉल प्रकार चयन - स्टाइल या मानक
• सूची को खोलने और बंद करने की एनीमेशन गति

एपीआई:

• स्टाइल सूची अद्यतन
• खुली / बंद सूची
• एक नए सक्रिय तत्व का कार्य
• गतिशील चौड़ाई में परिवर्तन
• सक्षम / अक्षम सूची

भविष्य में

• मोबाइल डिवाइस का समर्थन
• टिप्पणियों में आपकी इच्छा

GitHub पर परियोजना। सैंडबॉक्स डेमो पेज यहाँ है ।
यदि आप इस मुद्दे की त्रुटियों / समस्याओं का वर्णन कर सकते हैं तो मैं आभारी रहूंगा।

अद्यतन
जैसा कि कनेक्टर ने टैग किया है, jon 1.7+ को .on () के उपयोग के कारण आवश्यक है। सबसे अधिक संभावना है कि इसे .bind () द्वारा प्रतिस्थापित किया जाएगा।

अद्यतन २
आपकी टिप्पणियों और बग के लिए आप सभी का धन्यवाद। एक सप्ताह के भीतर यह किया जाएगा।