Draw "X" the word canvas HTML

Question

I used the canvas to draw the word “X” at the mouse position when I clicked, but when I draw a new word “X”, the old “X” was “BOLD”.

http://jsfiddle.net/darklight27/h4JvJ/

Do you have any suggestions for me? Thanks!

Answer 1

Before you start drawing your lines, call beginPath() :

 function drawX(x, y) { ctx.beginPath(); ctx.moveTo(x - 20, y - 20); ctx.lineTo(x + 20, y + 20); ctx.moveTo(x + 20, y - 20); ctx.lineTo(x - 20, y + 20); ctx.stroke(); } 

Updated jsFiddle code: http://jsfiddle.net/h4JvJ/23/