Это первый урок по созданию приложений и игр на javascript)
Хочу сказать что все уроки будут предлагаться вами , пишите мне в лс , про что будет следующий урок!!!
В первом уроке:
Создание эмулятора;
Вход в тему 2d;
Базовый функционал;
Первый обьект игры;
Приступим!
Создайте папку с названием "Первая игра";
Создайте в ней 2 файла 1:"index.html" 2:"script.js";
Откройте index.html;
Напишите следующие :
<html>
<head>
<meta charset="utf-8"></head>
<body>
<script src="script.js"></script>
<script>
</script>
</body>
</html>
Всё эмулятор готов!
Шаг 2 : "вход в тему 2d"
Откройте файл "script.js"
Напишите в нем:
document.innerHTML+="<canvas id="game"></canvas>";
Это значит , что мы создали рабочую поверхность!
[ПОДСКАЗКА] в javascript все функции пушуться с новой строки, и в конце каждой функции ставиться ";";
Далее пишем:
function obj(id){
return document.getElementById(id);
}
Это наша первая функция "вичисление по id"
[ПОДСКАЗКА]после закрытия блока "}" не ставиться ";";
И следующее:
canvas=obj("game");
ctx=canvas.getContext("2d");
Подобрали 'canvas', и взяли контекст "2d"
Шаг 3: "Базовый функционал"
Ну далее все довольно просто
Укажем размер игры в пикселях:
canvas.width=400;
canvas.height=400;
width:ширина,height:высота
Функции создания в уроке 2;
Шаг 4:"первый обьект";
Пишем :
ctx.fillRect(10,10,10,10);
Первая 10 : позиция от лева, вторая:позиция от верху, третья:ширина,четвёртая:высота
Откройте интернет , и зайдите на сайт "about:blank";
Перетащите из папка файл index.html в браузер[как из папки в папку, только браузер]
На этом всё!
До урока номер 2!!!
Присоединяйтесь — мы покажем вам много интересного
Присоединяйтесь к ОК, чтобы подписаться на группу и комментировать публикации.
Нет комментариев