ड्रैगूला के साथ आसानी से वेबसाइट पर ड्रैग एंड ड्रॉप जोड़ें
करने के लिए एक मुक्त पुस्तकालय के लिए देख रहे हैं सुविधाओं को खींचें और छोड़ें? फिर Dragula एकमात्र संसाधन है जिसकी आपको आवश्यकता होगी.
यह मुफ्त स्क्रिप्ट आपको देता है अपने पृष्ठ पर किसी भी तत्व के लिए ड्रैग एंड ड्रॉप सुविधाएँ जोड़ें. इसमें वेनिला जावास्क्रिप्ट के साथ रिएक्ट और एंगुलरजेएस फ्रेमवर्क के लिए समर्थन शामिल है.
ड्रैग्युला को स्थापित करना आसान है और यह आता है उपयोगकर्ता व्यवहार के लिए कस्टम ट्रिगर का एक गुच्छा. इसका अर्थ यह है कि उपयोगकर्ता द्वारा किसी आइटम को क्लिक करने, किसी आइटम को क्लिक करने या पृष्ठ के किसी भी हिस्से को फिर से व्यवस्थित करने के बाद आप अपने स्वयं के कार्यों को आग लगा सकते हैं.
यदि आप लाइव डेमो पर एक नज़र डालें तो आप पाएंगे कुछ कोड स्निपेट, साथ में प्रयोग करने योग्य नमूने.
ड्रैगूला सेटअप केवल एक जावास्क्रिप्ट फ़ाइल की आवश्यकता है यह काम करने के लिए। हालांकि, अतिरिक्त विकल्प थोड़ा भ्रमित कर सकते हैं.
उदाहरण के लिए, मान लें कि आपके पास दो कंटेनर हैं, #बाएं तथा #सही, आप ड्रैग करने योग्य वस्तुओं का समर्थन करना चाहते हैं। आपको करने की आवश्यकता होगी मैन्युअल रूप से इन कंटेनरों को Dragula फ़ंक्शन में जोड़ें खींचें और ड्रॉप विधियों का समर्थन करने के लिए.
यदि आपके पास फ्रंट-एंड डेवलपमेंट के मूल सिद्धांतों की ठोस समझ नहीं है तो आप ड्रैग्युला का उपयोग करने के लिए संघर्ष करेंगे। लेकिन, GitHub रेपो में बहुत है महान उदाहरण आप के साथ पालन कर सकते हैं और भी कोड स्निपेट आप कॉपी कर सकते हैं.
यहाँ कैसे के लिए GitHub डॉक्स से एक नमूना है दो (बाएं और दाएं) कंटेनरों को लक्षित करें:
ड्रैग्युला ([डॉक्यूमेंट.क्वेरीसेलेक्टर ('# लेफ्ट'), डॉक्यूमेंट.क्वेरीसेलेक्टर ('# राइट')]); ध्यान दें कि यदि आप GitHub पृष्ठ पर आगे देखेंगे तो आप पाएंगे विकल्पों की एक विशाल सूची आप इस फ़ंक्शन को पास कर सकते हैं.
आप चुन सकते हैं आइटम की प्रतिलिपि बनाना या स्थानांतरित करना है या नहीं, कौन से कंटेनर घसीटती हुई वस्तुओं का समर्थन करते हैं और भी कॉलबैक फ़ंक्शन विभिन्न उपयोगकर्ता व्यवहारों जैसे कि:
- एक कंटेनर पर मंडराते हुए
- प्रारंभिक क्लिक करें और घटना खींचें
- ड्रॉप इवेंट
- किसी तत्व को सीमा से बाहर छोड़ना
- किसी तत्व / कंटेनर को खींचकर क्लोनिंग करना
यह पुस्तकालय कुछ प्रारंभिक काम करेंगे लेकिन अगर आप जावास्क्रिप्ट से परिचित हैं, तो यह एक बिना दिमाग वाला होना चाहिए.
डेमो पेज को देखें देखो यह कैसे काम करता है और करने के लिए कुछ कोड नमूना विचार प्राप्त करें. ड्रैग्युला एक विशाल पुस्तकालय है और यह संभवतः सबसे अच्छा ओपन-सोर्स स्क्रिप्ट है अनुकूलन की व्यापक रेंज के साथ ड्रैग एंड ड्रॉप को संभालें.
