2012-01-31 12 views
13

Różne biblioteki JavaScript, takie jak jQuery UI, oferują interakcje przeciągnij i upuść, w których można przeciągnąć element constrain the movement do pojedynczej osi lub do określonego obszaru.Jak ograniczyć ruch podczas używania metody przeciągania i upuszczania HTML5?

Czy jest to możliwe za pomocą natywnego interfejsu API HTML5 drag and drop?

+5

Łączenie z w3schools powinno być traktowane jako przestępstwo. – artistoex

+0

możliwy duplikat [HTML5: przeciągnij/upuść na osi X i bez zanikania?] (Http://stackoverflow.com/questions/8933513/html5-drag-drop-on-x-axis-and-without-fade) – SiliconMind

+0

Wiem, że to stary post ... ale rozwiązałem ten problem, tworząc element klonu na 'dragstart', ukrywając oryginał, a następnie ustawiając pozycję klonu za pomocą zdarzenia' dragover' - gdzie można go ograniczyć. Nie różni się zbytnio od używania 'mousemove'. To było łatwiejsze niż całkowite przepisanie przeciągania i upuszczania - co, jak jestem pewien, wielu miało. – mseifert

Odpowiedz

7

Jest zupełnie inaczej! Przeciąganie i upuszczanie interfejsu użytkownika jQuery powoduje przeniesienie elementu (z górnymi i lewymi właściwościami CSS) na stronie.

Natywny interfejs API przeciągania i upuszczania HTML5 umożliwia przenoszenie "ducha" elementu przeciągalnego (oczywiście można ukryć oryginalny element podczas przeciągania ducha).

Interfejs API ma a lot of event, ale nie, nie można ograniczyć pozycji myszy, więc nie można ograniczyć się do pojedynczej osi (powoduje to, że duch podąża za pozycją myszy, nawet jeśli mysz opuści stronę (ale zdarzenie prawdopodobnie przestań działać)).

+3

+1, zaktualizowałem link z W3Schools do MDN, aby nie stać się tematem pytania. –

+7

Nigdy nie łączyłem się z W3schools, to był ktoś, kto zredagował moje pytanie. Ta strona jest kulawa. – callum

Powiązane problemy