Height Issue when switching from Portrait to Landscape views

[ndgwv]

Interesting problem, with jSignature on a jquery mobile page I can switch back and forth between Portrait and Landscape views on my iphone and the signature box works correctly. I've looked in Web Inspector and see the Canvas width and height change from (254px x 64px)P to (502px x 126px)L...all looks and works well.

However if I leave that page then rotate the device, the canvas get set to 100 x 25px. I believe this is because it is reading 100% for the Parent div, not pixels. When I navigate back to the Signature page, it is squashed, set still at 100 x 25px instead of 254px x 64px. The only fix I found is to rotate the device, which resets it to the correct pixels.

Using a $(window).on("orientationchange",function() I've tried $('#signature').prop("width", myw).css({'width':myw}); where myw = $(window).width(), but no luck. I've tried setting the canvas directly with $('canvas.jSignature').prop({"height": mh, "width": myw}).css({'height':mh+'px'}) but when I sign and rotate, it deletes the signature (like its reinitializing after these properties are forced upon it).

Is there a fix for this squashed height value when the device is rotated away from the signature page and returned to it?

[donluz]

I noticed a similar issue... signed on a desktop computer; then tried displaying on a tablet and much of the signature is out of sight. I've working on some way to scale the thing down, but no luck so far.

Based on when you posted this, I wonder if this (wonderful) project is still active as there's been no response???

[zevero]

You may try to trigger a resize Event

 window.dispatchEvent(new Event('resize'));

also you might to include this in your css

canvas.jSignature { height: 270px; }