डिफ़ॉल्ट ब्राउज़र चयन की जगह

Selectimus

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

काम का तंत्र इस प्रकार है:

• मानक चयन पूरी तरह से छिपा हुआ है
• इसके स्थान पर, एक बुलेटेड सूची बनाई जाती है, जो मूल्य विशेषता के साथ सूची तत्वों से भरी होती है, जो चयन से विकल्प तत्व की संख्या को संग्रहीत करती है। जिससे, ली पर क्लिक करने पर, मान के पैरामीटर के अनुसार, विकल्प को छिपे हुए चयन में चुना जाता है।
• उस स्थिति में, यदि छद्मकोश की सामग्री निर्दिष्ट दृश्य क्षेत्र की तुलना में बड़ी है, तो एक स्क्रॉलबार सूची में जोड़ा जाता है (jQuery प्लगइन स्क्रॉलबेर.जेएस) भी।
• स्क्रॉलबार की उपस्थिति को Selectimus.css स्टाइल फ़ाइल में बदला जा सकता है, आप बटन की छवि को ऊपर और नीचे स्क्रॉल करने के लिए भी बदल सकते हैं। (विकास में स्क्रॉलबार डिजाइन करने के लिए विकल्प)।

प्लगइन सुविधाएँ:

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

प्लगइन आरंभ:

$([elemenet]).selectimus([style] [, options]) 

जब प्लगइन को इनिशियलाइज़ किया जाता है, यदि अतिरिक्त स्टाइल पैरामीटर पास नहीं होते हैं, तो डिफ़ॉल्ट स्टाइल लागू होते हैं:

• रंग: '# 000',
• पृष्ठभूमि: '# एफएफ',
• color_up: '#FFF',
• बैकग्राउंड_अप: '# 7EA0FA',
• प्रदर्शन: 'इनलाइन-ब्लॉक',
• 'बॉर्डर-चौड़ाई': '1px',
• 'सीमा-शैली': 'ठोस',
• 'बॉर्डर-कलर': '# b6b6b6',
• 'बॉर्डर-रेडियस': '5px',
• मार्जिन: '3 पीएक्स 0',
• स्थिति: 'रिश्तेदार',
• अतिप्रवाह: 'दृश्यमान'

सूत्र यहां हैं
यहाँ विवरण के साथ डेमो पेज।

स्क्रॉलबारज प्लगइन

तत्वों पर मानक स्क्रॉल बार को उस पृष्ठ पर प्रतिस्थापित किया जाता है जिस पर अतिप्रवाह: छिपी हुई संपत्ति को सभी ब्राउज़रों में एक सार्वभौमिक के साथ लागू किया जाता है। अब यह केवल ऊर्ध्वाधर सामग्री के साथ काम करता है। विकास में स्क्रॉल बार की उपस्थिति को अनुकूलित करने के लिए विकल्प जोड़ने की क्षमता भी शामिल है।

सूत्र यहां हैं

शायद किसी को इस तरह के कार्यान्वयन में काम आएगा।

UPD: टिप्पणियों के लिए सभी को धन्यवाद। मैं दोषों को समाप्त करूंगा)