20.10.2019

HTML 5 Разработка игр — Урок 1

Spread the love
  •  
  •  
  •  
  •  
  •  

Оригинал статьи

С сегодняшнего дня мы начинаем серию статьей о создании игры в HTML5. В нашей первой статье мы рассмотрим основы -работа с Canvas, создание простых объектов, заполнение и обработка события связанные с мышкой. Обратите внимание на данном этапе мы будем изучать основы, не сразу работать в 3D с WebGL. Мы вернемся к WebGL в будущем. В каждой следующей статье мы будем делать что то новое. Сначала мы создадим объект с семью вершинами, в этих вершинах мы нарисуем круги и перемещая круги, мы будем перемещать вершины объекта. Получившийся в результате объект мы заполним полупрозрачным цветом. Я думаю, что этого достаточно для начала.
Получившийся результат мы заполним.

Ок , теперь загрузите файл примера и начинайте программировать.

Шаг 1. HTML

Ниже представлен HTML код примера.

index.html

Шаг 2. CSS

Ниже CSS стили использованные в примере

CSS / main.css

Шаг 3.JS

js/jquery-1.5.2.min.js

Мы будем использовать jQuery для нашего примера. Это позволит легко обработать различные события (для мышки и т.д ). Следующий файл, самый важный в нем содержится вся наша работа с графикой:

js/script.js

 

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

0

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *