Библиотека knigago >> Литература по изданиям >> Самиздат, сетевая литература >> Введение в JavaScript для Мага


СЛУЧАЙНЫЙ КОММЕНТАРИЙ

# 1427, книга: Восставший
автор: Константин Андреевич Подборнов

"Восставший" Константина Подборнова - это леденящая душу коллекция мрачных и экзистенциальных рассказов. Автор искусно создает атмосферу ужаса и безысходности, которая пронизывает каждую страницу. Рассказы варьируются от историй о проклятых домах до таинственных существ, от острых ощущений до психоделических кошмаров. Подборнов мастерски использует язык, чтобы вызвать чувство глубокого беспокойства и страха. Его проза богата мрачными образами и символикой, которая остается с...

Стефан Кох - Введение в JavaScript для Мага

Введение в JavaScript для Мага
Книга - Введение в JavaScript для Мага.  Стефан Кох  - прочитать полностью в библиотеке КнигаГо
Название:
Введение в JavaScript для Мага
Стефан Кох

Жанр:

Самиздат, сетевая литература, Литература ХX века (эпоха Социальных революций), Учебники и самоучители по компьютеру, Программирование: прочее, Java, Java Script

Изадано в серии:

неизвестно

Издательство:

неизвестно

Год издания:

ISBN:

http://rummelplatz.uni-mannheim.de/~skoch/

Отзывы:

Комментировать

Рейтинг:

Поделись книгой с друзьями!

Помощь сайту: донат на оплату сервера

Краткое содержание книги "Введение в JavaScript для Мага"

Аннотация к этой книге отсутствует.

Читаем онлайн "Введение в JavaScript для Мага". [Страница - 27]

function pressed(e) {

alert("Key pressed! ASCII-value: " + e.which);

}

</script>

</html>

Часть 12: Drag & Drop

Что такое drag & drop?


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

Что такое drag & drop? Например, некоторые операционные системы (такие как Win95/NT или MacOS) позволяют Вам стирать файлы, просто перетаскивая их в мусорную карзину. Иными словами, Вы щелкаете клавишей мыши над изображением файла, перетаскиваете его (то есть держите клавишу нажатой и просто двигаете мышь) — drag — в мусорную карзину, а затем отпускаете — drop — его там.

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

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

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

Язык JavaScript не поддерживает напрямую механизм drag & drop. Это значит, что у нас нет возможности назначить объекту image свойство dragable (перемещаемый) или что-либо в этом роде. Поэтому мы должны сами писать необходимый для этого код. Впрочем, Вы увидите, что это не так сложно.

Итак, то же нам нужно? Нам нужны две вещи. Во-вервых, мы должны регистрировать определенные события, связанные с работой мышью, то есть нужно понять, каким образом, мы сможем узнать, какой объект необходимо переместить и на какую позицию? Затем нам нужно подумать, каким именно образом мы сможем показывать перемещение объектов по экрану. Конечно же, мы будем пользоваться такой новой возможностью языка, как слои, при создании объектов и перемещении их по экрану. Каждый объект представлен собственным слоем.


События при работе с мышью в JavaScript 1.2


Какие события, происходящие при работе с мышью, нам следует использовать? У нас нет такого события, как MouseDrag, однако того же самого мы можем достичь, отслеживая события MouseDown, MouseMove и MouseUp. В версии 1.2 языка JavaScript используется новая модель событий. И без нее мы не смогли бы решить нашу задачу. Я уже говорил об этой новой модели на предыдущем уроке. Однако давайте взглянем на некоторые важные ее части еще раз.

Пользователь нажал клавишу мыши в каком-либо месте на окне браузера. Наш скрипт должен зафиксировать это событие и вычислить, с каким объектом (то есть слоем) это было связано. Нам необходимо знать координаты точки, где произошло это событие. В JavaScript 1.2 реализован новый объект Event, который сохраняет координаты этой точки (а также еще и другую информацию о событии).

Другой важной момент заключается в перехвате событий. Если пользователь, например, щелкает по клавише мыши, то сигнал о соответствующем событии посылается непосредственно объекту button. Однако в нашем примере необходимо, чтобы событие обрабатывалось объектом window (окно). Поэтому мы позволяем объекту окна перехватывать сигнал о событии, связанном с мышью, т. е. чтобы именно объект window фиксировал это событие и имел возможность на него реагировать. Это демонстрируется в следующем примере (на примере события Click). Вы можете щелкнуть в любом месте окна браузера. При этом возникнет окно сообщения, где будут показаны координаты точки, где это событие имело место.

Код этого примера:


<html>

<script language="JavaScript">

<!-

window.captureEvents(Event.CLICK);

window.onclick= displayCoords;

function displayCoords(e) {

alert("x: " + e.pageX + " y: " + e.pageY);

}

// — >

</script>

"Кликните" клавишей мыши где-нибудь в этом окне.

</html>


Сперва мы сообщаем, что объект window перехватывает сигнал о событии Click. Для этого мы пользуемся методом captureEvent(). Строка

window.onclick= displayCoords;

говорит о том, что должно происходить, когда случается событие Click. Конкретнее, здесь сообщается, что в качестве --">

Оставить комментарий:


Ваш e-mail является приватным и не будет опубликован в комментарии.