वेनक के साथ शुद्ध सीएसएस में न्यूनतम टूलटिप्स बनाएं
इस तरह के एक अजीब नाम के साथ, आप इससे बहुत उम्मीद नहीं करेंगे Wenk, मुफ़्त CSS टूलटिप लाइब्रेरी. फिर भी यह है सबसे छोटी पुस्तकालयों में से एक जब आप gzipped हो तो 1KB के तहत माप प्राप्त कर सकते हैं.
वेनक उपयोग करता है शुद्ध सीएसएस के साथ डेटा-* गुण बनाना लाइव टूलटिप्स कि आप अपनी पसंद के हिसाब से आराम कर सकते हैं। सभी के सर्वश्रेष्ठ, यह गीथहब पर उपलब्ध स्रोत कोड के साथ एक पूरी तरह से मुक्त पुस्तकालय है.
ये हल्के टूलटिप्स आपकी वेबसाइट पर जोड़ने के लिए सुपर सरल हैं। आपको बस जरूरत है Wenk.css फ़ाइल आपके पृष्ठ शीर्ष लेख में जोड़ा गया, जिसे आप GitHub repo से डाउनलोड कर सकते हैं.
या, आप भी कर सकते हैं CDN फ़ाइल जोड़ें जिसे GitHub की CDN पर होस्ट किया गया है। यहाँ उस के लिए कोड है:
या, यदि आप एक npm / bower फैन हैं तो आप इस पैकेज को स्थापित कर सकते हैं टर्मिनल से.
डिफ़ॉल्ट टूलटिप टैग में बहुत अधिक कस्टम डेटा नहीं है। उन्होंने आपको जाने दिया स्थिति और चौड़ाई का चयन करें, लेकिन आपको करना होगा सीएसएस को मैन्युअल रूप से बदलें अगर आप उन्हें अलग तरह से स्टाइल करना चाहते हैं.
उदाहरण के लिए, आप टूलटिप में एक सीएसएस तीर जोड़ सकते हैं जो टूलटिप तत्व के ऊपर दिखाई देता है। यह बनाने के लिए काफी सरल है, लेकिन आपको वेन स्टाइलशीट को परिमार्जन करने की आवश्यकता होगी सटीक सीएसएस वर्ग खोजें विस्तार करना.
यहाँ कुछ का एक नमूना है डिफ़ॉल्ट कोड वेंकट टूलटिप्स के लिए:
सही करने के लिए वेनक! मुख्य वेन्क लैंडिंग पृष्ठ में शामिल हैं लाइव डेमो कि आप मँडरा करके परीक्षण कर सकते हैं। य़े हैं सबसे बुनियादी टूलटिप्स आपको मिलेगा लेकिन वे एक ऐसे पुस्तकालय के लिए एकदम सही हैं जिसका वजन एक किलोबाइट से कम है.
विचार करने के लिए एक प्रमुख बात है ब्राउज़र का समर्थन. क्रोम और फ़ायरफ़ॉक्स के सभी संस्करण ठीक काम करना चाहिए. ओपेरा 12+ और ओपेरा मिनी v8 + के साथ भी। लेकिन IE8 और IE10 लगता है कोई परेशानी इन टूलटिप का प्रतिपादन। शुक्र है कि उनका बाजार हिस्सा तेजी से गिर रहा है लेकिन उपयोग करने से पहले इस पर विचार करना चाहिए.
मैं अभी भी चकित हूं कि आप कितने केबी के साथ कर सकते हैं। वेन्क लाइब्रेरी आधुनिक फ्रंटेंड डेवलपमेंट का एक वसीयतनामा है और यह दर्शाता है कि थोड़ा बहुत आगे बढ़ सकता है.
आप के माध्यम से खुदाई कर सकते हैं संपूर्ण स्रोत GitHub पर, साथ में लाइव डेमो तथा कोड के टुकड़े अपनी स्वयं की साइट के लिए इन टूलटिप्स को सेट अप करने और बनाने के लिए.
