Mordekaiser
New member
Hallo,
ich möchte gerne ein Bild in einer Canvas anzeigen. Jedoch wenn ich die Seite über Chrome aufrufe, wird kein Bild in der Canvas angezeigt. Mach ich dieses aber im Tryit Editor von W3Schools funktioniert es... Kann mir jemand bei diesen Problem helfen?
Code:
Danke schon mal im voraus.
ich möchte gerne ein Bild in einer Canvas anzeigen. Jedoch wenn ich die Seite über Chrome aufrufe, wird kein Bild in der Canvas angezeigt. Mach ich dieses aber im Tryit Editor von W3Schools funktioniert es... Kann mir jemand bei diesen Problem helfen?
Code:
HTML:
<!DOCTYPE html>
<html>
<head>
<title>index</title>
</head>
<body>
<span id="x"> </span> X <span id="y"></span> Y
<img id="coin" width="220" height="277" src="coin.jpg" />
<div id="game_object" style="position: relative;">
<canvas id="myCanvas" style="border:1px solid #d3d3d3; height: 800px; width: 700px;" onmousemove="maus(event)">update browser</canvas>
</div>
<script>
init();
function init()
{
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("coin");
ctx.drawImage(img, 100, 100);
}
function maus(e)
{
var x = e.pageX - document.getElementById("game_object").offsetLeft;
var y = e.pageY - document.getElementById("game_object").offsetTop;
document.getElementById("x").innerHTML = x;
document.getElementById("y").innerHTML = y;
}
</script>
</body>
</html>Danke schon mal im voraus.