Что такое технология drag & drop?

С помощью новой модели событий JavaScript 1.2 и слоёв мы можем пользоваться технологией drag & drop на нашей web-странице. Для этого, Вам понадобится крайней мере Netscape Navigator 4.0 поскольку мы используем особенности JavaScript 1.2. .

Что такое drag & drop? Некоторые операционные системы (подобно Win95/NT или MacOS) позволяют Вам например стирать файлы, перетаскивая их иконку в мусорную корзину. Вы нажимаете на иконку файла, перемещаете (то есть Вы удерживаете кнопку мыши при ее перемещении) иконку на мусорную корзину и оставляете это там.
Технология drag & drop, которую мы хотим выполнять здесь, ограничена web-страницей. Так что Вы не можете использовать код, показанный здесь, чтобы перетащить объекты из HTML-страницы на ваш жесткий диск или сделать что то вроде этого. (Начиная с Netscape Navigator 4.0 ваш сценарий может реагировать на событие по имени DragDrop , когда кто - то отпускает файл в окне броузера, но это не является предметом нашего разговора)

Теперь Вы можете проверить пример, который мы собираемся разбирать на этом уроке. После того, как Вы нажмете эту кнопку щелкните на различных объектах и попробуйте их перемещать:

Вы также могли бы проверить пример, который пребоставляет Netscape. Вы можете его по этому адресу: http://home.netscape.com/comprod/products/communicator/user_agent_vacation.html

JavaScript не поддерживает drag & drop непосредственно. Это означает, что мы не можем просто определить свойство dragable (или типа этого) в Image-объекте. Мы должны написать код для нашего случая. Вы увидите, что это не слишком трудно.
Так что же нам нужно? Мы нуждаемся в двух вещах. Сначала мы должны регистрировать некоторые события мыши, то есть как мы узнаем, какой объект должен быть перемещен на какую позицию? Затем мы должны заострить наше внимание на том, как мы можем отображать перемещения объектов на экране. Конечно мы используем новое свойство слоёв для определения различных объектов и их перемещения относительно экрана. Каждый объект представляется через собственный уровень.

Содержание раздела