Guten Morgen =)
Ich versuche gerade ein Zeichenprogramm zu erstellen - zeichnen und löschen klappt, aber nun habe ich ein Problem damit, dass man die Farben ändern kann...
kann halt einmal die farbe ändern, dann aber nicht mehr und wenn die farbe zu braun geändert wird und man zum zeichnen ansetzt, wird das, was zuvor in schwarz gezeichnet wurde auch braun, sollte aber eig schwarz bleiben....
hilfe? =) danke schonmal im voraus
Ich versuche gerade ein Zeichenprogramm zu erstellen - zeichnen und löschen klappt, aber nun habe ich ein Problem damit, dass man die Farben ändern kann...
HTML:
<html><head></head><body>
<canvas id="zeichenflaeche" width="898px" height="248px" style="border:1px solid black; cursor:crosshair" onmousemove="liniezeichnen(event)" onmousedown="start(event)" onmouseup="stop(event)">Error</canvas>
<div style="background-color:#505050; width:900px; height:50px">
<input type="button" value="clear" style="width:50px; height:30px;" onclick="reset(event)"/>
<a href="#" onClick="schwarz()">schwarz</a>
<a href="#" onClick="braun()">braun</a>
</div>
<script>
var canvas =document.getElementById('zeichenflaeche');
var c =canvas.getContext('2d');
var z =false;
var colorBlack="#000000";
var colorBrown="#491517";
var curColor = colorBlack;
var clickColor = new Array();
function start(event)
{
var posX =event.pageX;
var posY =event.pageY;
c.moveTo(posX,posY);
z = true;
}
function stop(event)
{
z =false;
}
function liniezeichnen(event)
{
if(z==true)
{
var posX =event.pageX;
var posY =event.pageY;
c.lineTo(posX,posY);
c.lineWidth =10;
c.strokeStyle = clickColor;
c.stroke();
c.lineCap = "round";
}
}
function reset(event)
{
canvas.width =canvas.width;
}
function addClick(x, y, dragging)
{
clickX.push(x);
clickY.push(y);
clickDrag.push(dragging);
clickColor.push(curColor);
}
function schwarz()
{
c.strokeStyle = colorBlack;
}
function baun()
{
c.strokeStyle = colorBrown;
}
</script>
</body></html>
hilfe? =) danke schonmal im voraus
Zuletzt bearbeitet: