Merhaba,
Bugünkü yazımda sizin girdiğiniz değerlere (textbox’a) canvas’ımızı yönlendireceğiz kodlarımız şöyle;
<!doctype html>
<html><head>
<style>
#kutu{
top: 0px;
background-color: yellow;
left: 0px;
width: 50%;
height: 50%;
border: solid;
position: absolute;
z-index: -1;
}
</style>
<meta charset="utf-8">
<title>Başlıksız Belge</title>
</head>
<body>
<div>
<a>y</a> <input id="y">
<a>x</a> <input id="x">
</div>
<canvas id="kutu"></canvas>
<script>
var x = document.getElementById("x");
var y = document.getElementById("y");
var kutu = document.getElementById("kutu");
y.value=0;
x.value=0;
y.onkeyup=itele;
x.onkeyup=itele;
function itele(){
kutu.style.top=y.value+"px";
kutu.style.left=x.value+"px";
}
</script>
</body>
</html>
Önizleme
Bir yanıt yazın