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

Для начала мы рассмотрим разметку с помощью HTML, в которой подключим некоторые скрипты, также будем использовать некоторые плагины с репозитория google, чтобы сократить загрузку игры.

На стилях CSS мы не будем останавливаться, в стилях находится макет страницы, ничего интересного. Их можно просмотреть в исходниках.

Теперь рассмотрим скрипты, практически каждый параметр подписан в коде, в нем мы будем подключать звуковое сопровождение, скорость передвижение, и многое другое..

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

И, наконец, мы должны добавить нашиx врагов в случайном порядке:

Материал взят из зарубежного источника. И представлен исключительно в ознакомительных целях.

Читайте также: