मुखपृष्ठ » टूलकिट » झूले पर ज़ूम छवियाँ करने के लिए ZooMove jQuery प्लगइन

    झूले पर ज़ूम छवियाँ करने के लिए ZooMove jQuery प्लगइन

    यदि आपने कभी कोई ई-कॉमर्स साइट बनाई है तो आपने देखा होगा छवि जूमिंग प्रभाव. आप एक उत्पाद फ़ोटो को हॉवर करते हैं और छवि का वह भाग एक के लिए आवर्धित होता है स्पष्ट दृश्य.

    ZooMove प्लगइन के लिए एक शानदार तरीका है इस प्रभाव को दोहराएं अपनी साइट पर आईटी इस jQuery द्वारा संचालित, तो आप इसे प्राप्त कर सकते हैं और बिना अधिक कोड के जल्दी से चल सकते हैं.

    ज़ूवॉव पूरी तरह से स्वतंत्र और खुला स्रोत है, उपलब्ध है गिटहब पर किसी भी जिज्ञासु डेवलपर्स के लिए। इसके माध्यम से स्थापित किया जा सकता है NPM, कुंज, धागा, या सीधे से डाउनलोड किया गया CDNJS.

    एक ZooMove छवि सेट करने के लिए, आपको आवश्यकता होगी तीन विशिष्ट फाइलें अपने पृष्ठ शीर्ष लेख में:

    1. jQuery
    2. झूमी सीएसएस
    3. ज़ूमो जेएस

    दोनों ZooMove फ़ाइलें खनन किया जा सकता है यदि आप तेज़ पृष्ठ लोड चाहते हैं। यदि आप आसान हो तो आप सीएसएस फ़ाइल को अपनी मुख्य स्टाइलशीट में भी जोड़ सकते हैं.

    सभी वास्तविक जादू HTML में होते हैं जहां आप कर सकते हैं HTML5 सेट करें data- * विशेषताएँ विभिन्न प्रभावों के लिए.

    इससे आप अपना शिल्प तैयार कर सकते हैं अपने कस्टम जूमिंग प्रभाव चार अलग-अलग मापदंडों के आधार पर:

    1. डेटा-चिड़ियाघर पैमाने पर - परिभाषित करता है होवर करते समय कुल ज़ूम आकार (उदा। २०० के लिए २.०%)
    2. डेटा-जू-चाल - छवि को परिभाषित करता है या नहीं कर्सर के साथ चलता है
    3. डेटा-चिड़ियाघर से अधिक - ज़ूम की गई छवि को परिभाषित करता है मूल पर दिखाई देते हैं
    4. डेटा-जू-कर्सर - परिभाषित करता है कर्सर बिंदु

    एक अंतिम पांचवें पैरामीटर आपको यह परिभाषित करने देता है कि क्या है नई छवि URL होना चाहिए (यदि आवश्यक हो).

    आप IE9 + सहित सभी प्रमुख ब्राउज़रों में ZooMove का उपयोग कर सकते हैं। यह प्लगइन है व्यापक रूप से समर्थित और यह एक उपयोगकर्ता अनुभव की एक बिल्ली प्रदान करता है.

    यदि आप एक की तलाश कर रहे हैं सरल होवर-टू-जूम लाइब्रेरी ZooMove एक उत्कृष्ट विकल्प है। आईटी इस काफी हल्का किसी भी वेबसाइट पर चलाने के लिए और यह है jQuery द्वारा संचालित, इसलिए आपको इसे काम करने के लिए अधिक कोड लिखने की आवश्यकता नहीं होगी.

    इसे देखने के लिए मुख्य पृष्ठ पर जाएँ और अधिक जानने के लिए GitHub पर प्रलेखन देखें.