[HTML 5] Problème visibilité canvas

[vbaguet]

Bonjour à tous,

Voilà j'ai un petit soucis, j'ai un canvas de drawing, donc dans lequel on peu dessiner, que j'ai placé dans un div conteneur.
Si je ne place pas le canvas dans le div conteneur tout fonctionne bien, le tracé de mon crayon apparait bien.
Mais si je le laisse dans ce conteneur plus rien ne s'affiche, comme si le conteneur prenait le dessus xD

J'ai essayé avec les z-index, ca ne fonctionne pas, quelqu'un à une idée ?

Voici mon code html :

Code :

1
2
3
4
5
6
7
8
 
<section id="container">
 
<canvas id="drawpanel"></canvas>
<input type="button" value="Clear Canvas" onclick="clearCanvas();">
<input type="button" value="Save My Drawing" onclick="centerElt('saveDrawing',680,340);">
 
</section>

CSS :

Code css :

1
2
3
4
5
 
	#credits img { position: relative; top: 6px; margin-left:8px; }
#container { width: 680px; height: 390px; position: absolute; left: 50%; top: 50%; margin-top: -195px; margin-left: -340px; }
 
#drawpanel { width: 680px; height: 340px; border: 1px solid #999; margin-bottom: 10px; cursor: crosshair; }

Merci d'avance

[charly-b]

Bonjour,

Je ne suis pas sûr que le problème vienne de là, mais il me semble que spécifier le width et le height du canvas en css ne suffit pas. Il faut les placer en attributs sur la balise même :

Code :

<canvas id="drawpanel" width="680" height="340"></canvas>