Question

How would I go about adding a html5 canvas element on a click function or does it need to be on document ready or load?

What I would like to do is create a way to use the canvas to act as a highlighter, the user clicks the hightlighter button, then draws the highlighted mark.

I was thinking of including this on a click event so I could continue to use my touchwipe events. THis is on an Android device, I currently have a slider cycling through rasterized pages of a book that I want to allow users to markup. The canvas element would sit on top of the img’s and be semi transparent.

Can anyone point me in the right direction?

Answer 1

canvas element behaves like other dom elements in this case. Try:

var x = $('<canvas height="100px" width="100px"> </canvas> '),
    y = x[0].getContext('2d');

y.strokeRect(0,0,50,50)

x.appendTo('body')