Игра про егора огурца (чекайте описание)
(cоздайте .txt file и вставьте туда код, а потом смените тип файла на .html
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Егор Огурец</title>
<style>
body{margin:0;overflow:hidden;background:linear-gradient(#b8ffb8,#67c667);font-family:Arial}
canvas{display:block}
#ui{position:fixed;top:10px;left:10px;color:#114b22;font-size:24px;font-weight:bold}
#menu{
position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
background:rgba(0,0,0,.3);color:#fff;flex-direction:column
}
button{
padding:12px 24px;font-size:20px;border:none;border-radius:12px;
background:#1f8f3d;color:white;cursor:pointer
}
</style>
</head>
<body>
<div id="ui">Очки: <span id="s">0</span> | Жизни: <span id="l">3</span></div>
<div id="menu">
<h1>Егор Огурец 🥒</h1>
<p>Собирай огурцы и избегай помидоров</p>
<button onclick="start()">Играть</button>
</div>
<canvas id="c"></canvas>
<script>
c.width=innerWidth;
c.height=innerHeight;
x=120;y=300;s=0;l=3;run=0;
ctx=c.getContext("2d");
keys={};arr=[];
onresize=()=>{c.width=innerWidth;c.height=innerHeight}
onkeydown=e=>keys[e.key]=1;
onkeyup=e=>keys[e.key]=0;
function start(){
menu.style.display="none";
s=0;l=3;arr=[];x=120;y=300;run=1;
loop();
}
function add(){
arr.push({
x:c.width+50,
y:Math.random()*(c.height-100)+50,
bad:Math.random()<0.3
});
}
function drawPlayer(){
ctx.fillStyle="#3fa34d";
ctx.beginPath();
ctx.ellipse(x,y,25,35,0,0,7);
ctx.fill();
ctx.fillStyle="#fff";
ctx.beginPath();
ctx.arc(x-8,y-5,4,0,7);
ctx.arc(x+8,y-5,4,0,7);
ctx.fill();
ctx.fillStyle="#000";
ctx.beginPath();
ctx.arc(x-8,y-5,2,0,7);
ctx.arc(x+8,y-5,2,0,7);
ctx.fill();
}
function loop(){
if(!run)return;
requestAnimationFrame(loop);
ctx.clearRect(0,0,c.width,c.height);
if(keys["ArrowUp"]||keys["w"])y-=5;
if(keys["ArrowDown"]||keys["s"])y+=5;
if(keys["ArrowLeft"]||keys["a"])x-=5;
if(keys["ArrowRight"]||keys["d"])x+=5;
x=Math.max(30,Math.min(c.width-30,x));
y=Math.max(30,Math.min(c.height-30,y));
if(Math.random()<0.03)add();
for(let i=arr.length-1;i>=0;i--){
o=arr[i];
o.x-=5+s*0.02;
ctx.fillStyle=o.bad?"red":"lime";
ctx.beginPath();
if(o.bad){
ctx.arc(o.x,o.y,18,0,7);
}else{
ctx.ellipse(o.x,o.y,20,10,0,0,7);
}
ctx.fill();
d=Math.hypot(x-o.x,y-o.y);
if(d<35){
if(o.bad){
l--;
}else{
s+=10;
}
arr.splice(i,1);
}
if(o.x<-50)arr.splice(i,1);
}
drawPlayer();
S.textContent=s;
L.textContent=l;
if(l<=0){
run=0;
menu.innerHTML=`
<h1>Игра окончена</h1>
<p>Счёт: ${s}</p>
<button onclick="start()">Играть снова</button>
`;
menu.style.display="flex";
}
}
S=document.getElementById("s");
L=document.getElementById("l");
</script>
</body>
</html>По дате
По рейтингу
Я не разбираюсь в коде. Ты мой компьютер съешь если я вставлю код
html - браузерная страница. игра в брузере.
Видео по теме