willowsystems / jSignature

jQuery plugin - draw signature in browser.
720 stars 266 forks source link

jSignature on Android device using Chrome doesn't work when zoomed #62

Open ghost opened 9 years ago

ghost commented 9 years ago

When I use Chrome on any mobile device the signature will only work if the page is displayed in default zoom. If I zoom in on the signature area it won't render correctly. It looks like the x and y coordinates are offset and the signature is drawn outside the visible area.

This issues can be reproduced on the demo site: http://willowsystems.github.io/jSignature/#/demo/

Example devide: Samsung Galaxy S5 using Chrome version 46.0.2490.76

I have also tested on a Lenovo tablet with the same result in Chrome.

I'm wondering if anyone has a workaround/fix for this?

Thanks,

Per

laDanz commented 7 years ago

I'm also interessted in this feature, but it seems this is a common problem.

Because of the use of jQuery .offset() method in setStartValues, and its restrictions:

Also, dimensions may be incorrect when the page is zoomed by the user; browsers do not expose an API to detect this condition.

See https://github.com/jquery/jquery/issues/3187

openroadgit commented 7 years ago

One more with this problem; anyone have a work around?

uklimaschewski commented 7 years ago

@openroadgit have a look at https://github.com/brinley/jSignature, it is more actual. This project here is is a dead fork.

davidhartman00 commented 7 years ago

We had a similar issue. The signature would not work at all on Android Chrome (FF worked). It looked like the signature was drawing way off from the actual signature pad.

Finally found a workaround as something with the way the page handles zooming that was causing the problem. Include this in your head <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>

All credit goes to my coworker Sunni