18 Temmuz 2016 Pazartesi
HTML5 CANVAS DUVARA ÇARPAN TOP YAPIMI
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
canvas{
border:2px solid #999;
}
</style>
<script>
window.onload=function(){
}
x=100;/*başlangıç konumu*/
y=100;/*başlangıç konumu*/
vx=1;
vy=1;
function eylem(){
var mycanvas=document.getElementById("mycanvas");
ctx=mycanvas.getContext("2d");
if(x==0){
vx=+1;
vy=-1;
}
if(x==600)
{
vx=-1;
}
if(y==0){
vy=+1;
}
if(y==400){
vy=-1;
}
ctx.beginPath();
ctx.clearRect(0,0,600,400);/*tuvalı siliyor*/
ctx.fillStyle="red";
ctx.arc(x,y,25,0*Math.PI,2*Math.PI);/*x,y,yarıçap,başlangıç açısı,bitiş açısı*/
ctx.fill();
x+=vx;
y+=vy;
}
setInterval(eylem,1);
</script>
</head>
<body>
<canvas id="mycanvas" height="400" width="600"></canvas>
</body>
</html>
Kaydol:
Kayıt Yorumları (Atom)
Hiç yorum yok:
Yorum Gönder