2012-01-31 15 views
13

jQuery यूआई जैसे विभिन्न जावास्क्रिप्ट पुस्तकालय, ड्रैग-एंड-ड्रॉप इंटरैक्शन प्रदान करते हैं जहां आप ड्रैग किए गए तत्व के constrain the movement को एक अक्ष में या किसी विशेष क्षेत्र में कर सकते हैं।एचटीएमएल 5 देशी ड्रैग और ड्रॉप का उपयोग करते समय आंदोलन को बाधित कैसे करें?

क्या इस तरह की चीज मूल HTML5 drag and drop एपीआई का उपयोग कर संभव है?

+5

w3schools से जोड़ने को एक कट्टरपंथी माना जाना चाहिए। – artistoex

+0

संभावित डुप्लिकेट [एचटीएमएल 5: एक्स-अक्ष पर ड्रैग/ड्रॉप और बिना फीका?] (Http://stackoverflow.com/questions/8933513/html5-drag-drop-on-x-axis-and-without-fade) – SiliconMind

+0

मुझे पता है कि यह एक पुरानी पोस्ट है ... लेकिन मैंने इसे 'ड्रैगस्टार्ट' पर क्लोन तत्व बनाकर, मूल को छुपाकर, और क्लोन की स्थिति को 'ड्रैगओवर' ईवेंट के साथ सेट करके हल किया - जहां इसे बाधित किया जा सकता है। 'Mousemove' का उपयोग करने से बहुत अलग नहीं है। ड्रैग और ड्रॉप को पूरी तरह से लिखना आसान था - जो मुझे यकीन है कि कई लोगों के पास है। – mseifert

उत्तर

7

यह बिल्कुल अलग है! jQuery UI ड्रैग और ड्रॉप पृष्ठ में तत्व स्थानांतरित करें (शीर्ष और बाएं सीएसएस गुणों के साथ)।

देशी HTML5 ड्रैग और ड्रॉप एपीआई केवल आपको खींचने योग्य तत्व के "भूत" को स्थानांतरित करने की अनुमति देता है (बेशक, आप भूत को खींचते समय मूल तत्व को छुपा सकते हैं)।

एपीआई a lot of event के साथ आता है लेकिन नहीं, आप माउस की स्थिति को बाधित नहीं कर सकते हैं ताकि आप एक धुरी को बाधित न कर सकें (क्योंकि भूत माउस की स्थिति का पालन करता है, भले ही माउस पृष्ठ छोड़ देता है (लेकिन घटना शायद संचालित बंद करो))।

+3

+1, मैंने प्रश्न के विषय बनने से बचने के लिए डब्ल्यू 3 स्कूल्स से एमडीएन तक लिंक अपडेट किया। –

+7

मैंने कभी भी W3schools से लिंक नहीं किया, वह वह व्यक्ति था जिसने मेरा प्रश्न संपादित किया था। यह साइट लंगड़ा है। – callum

संबंधित मुद्दे