Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как определить положение объекта при drag and drop? (https://javascript.ru/forum/dom-window/37394-kak-opredelit-polozhenie-obekta-pri-drag-drop.html)

platedz 18.04.2013 02:44

Как определить положение объекта при drag and drop?
 
Делаю по аналогии
http://javascript.ru/ui/draganddrop#refaktoring
Скажем я зацепил объект A и перемещаю его
Объект A скажем размером 100x100 px и мне нужно его положить в объект B. Но как определить, что объект A находится над объектом B, если курсор мыши еще не находится над ним?

Также хотелось бы узнать что за события
onDrag
onDragEnter
onDragLeave
onDragOver
onDragStart
onDrop
и тд.
Вообще читая статью ожидал увидеть описание именно этих событий, а оказывается все строится только на событиях мыши.

platedz 18.04.2013 04:31

И подскажите, пожалуйста, как избавиться от ошибки

Uncaught TypeError: Cannot read property 'className' of null
document.onmousemove

Вызванной element.parentNode.className

skrudjmakdak 18.04.2013 08:58

чтобы узнать находится объект над объектом, нужно знать координаты этих двух объектов, а также их высоту и длинну.. а там уже по условиям (if)...

что насчет element.parentNode.className.. попробуйте вывести в консоль cjnsole.log(element.parentNode) и посмотрите что там будет. возможно там лежит не то что вы хотите

danik.js 18.04.2013 10:13

А смысл определять положение блока? Тем более что не во всех браузерах будет отображаться призрак блока. Сработало событие ondragover - значит курсор над элементом-акцепотором. Что еще для счастья нужно?

skrudjmakdak 18.04.2013 10:47

чел хочет, чтобы был объект над объектом, а не на мышь над объектом.. я сказал

platedz 18.04.2013 13:25

Вообще да хотел, сделать если объект над объектом, но подумал и решил сделать по курсору мыши. По положению корректно определить очень сложно, нужно получается определить, если он скажем на двух объектах сразу, на каком именно объекте он БОЛЬШЕ в данный момент. Пришел к выводу что смысл, смысла нет, и особо это ничего не изменить. Получится почти тоже, что если курсор мыши над объектом

Насчет element.parentNode.className, я делаю проверку, при событии onmousemove, если

if(element.parentNode.className == "My_class") то вставляю объект.

класс есть не у всех элементов, поэтому очевидно вылезает ошибка. Работе она не мешает, но хотелось бы убрать element.parent.hasAttribute("My_class"), тоже дает ошибку

platedz 18.04.2013 13:27

По поводу событий ongrag.... и тд. я честно говоря не очень понял. Было бы интересно узнать как и где их можно использовать, для чего они предназначены. Коротких описаний этих событий много нашел, а вот нормальной статьи описывающих их работу нет. Может кто-подскажет, что нибудь по этому поводу.

Aetae 18.04.2013 13:33

Дело в том, этот стандарт аутсорсил инопланетянин, ни слухом ни духом не ведавший о человеческом вебе. Потому сейчас все продолжают использовать самописный drag на основе mousemove, а эту хрень применяют только в очень специфических случаях.)

skrudjmakdak 18.04.2013 13:40

я применял драп дроп. перетягивал файлы (картинки) с рабочего стола (папки) в браузер. конечно есть input file для этого. у меня работало и так и так (так сказать для удобства, точней для понтов)

skrudjmakdak 18.04.2013 13:40

я применял драп дроп. перетягивал файлы (картинки) с рабочего стола (папки) в браузер. конечно есть input file для этого. у меня работало и так и так (так сказать для удобства, точней для понтов)


Часовой пояс GMT +3, время: 13:17.