en.javascript.info/02-ui/02-events-and-interfaces/03-obtaining-event-object/01-move-ball-field/task.md
Ilya Kantor f301cb744d init
2014-10-26 22:10:13 +03:00

1.5 KiB
Raw Blame History

Передвигать мяч по полю

[importance 5]

Сделайте так, что при клике по полю мяч перемещался на место клика.

[iframe src="solution" height="260" link]

Требования:

  • Мяч после перелёта должен становиться центром ровно под курсор мыши, если это возможно без вылета за край поля.
  • CSS-анимацияне обязательна, но желательна.
  • Мяч должен останавливаться у границ поля, ни в коем случае не вылетать за них.
  • При прокрутке страницы ничего не должно ломаться.

Решение лучше делать в два этапа.

  1. Первый этап -- мяч сдвигается левым-верхним углом под курсор мыши.
  2. Второй этап -- мяч сдвигается центром и добавляется проверка на край поля.

Замечания:

  • Код не должен зависеть от конкретных размеров мяча и поля.
  • Текущий HTML/CSS нельзя менять, можно лишь "украшать" (анимация).
  • Вам пригодятся свойства `event.clientX/event.clientY`

[edit src="task" task/]