Canvas size responsive

[50l3r]

Hi,

I need to create a responsive signature pad with 100% width and specific height (300px)

How can i do this?

[mihai-gritcan]

@50l3r was you able to do that ?
@szimek any suggestions please ? :) I see a PullRequest exist for that, and is old old :)
#100

[Amsvartner]

Afaik you can't set canvas width to a percentage, but you can place the canvas element in a container that has it's width set to 100%, then read the exact width of said parent element with jQuery. Then you can set the canvas width manually. Do this before you intialize SignaturePad.

var canvas = document.querySelector("canvas");
var parentWidth = $(canvas).parent().outerWidth();

canvas.setAttribute("width", parentWidth);

this.signaturePad = new SignaturePad(canvas);

[50l3r]

Sorry for delay.

It works :)

[yokean1605]

Thanks, it works to for me.