search

brinley / jSignature

jQuery plugin for adding web signature functionality
http://www.unbolt.net/jSignature
694 stars 530 forks source link

Opera Mini on Android: Page starts at the wrong size. #13

Closed seanbamforth closed 12 years ago

seanbamforth commented 12 years ago

In Opera Mini, the signature displays as longer than the width of the display area. I believe this is an Opera Mini issue, but I fixed this by adding the following : 

    @-o-viewport {
      width: 100%;
      zoom: 1;
    }

to the CSS .

dvdotsenko commented 12 years ago

Puzzled by this.

Opera Mini is not a "web browser" but more of "remotely-rendered images viewer" Page is rendered on server and an image (with a fancy click map) is sent to Opera Mini. jSignature (or any other page that uses javascript for interactive in-browser behavior) will NOT (ever?) work on Opera Mini. (Apple does not allow alternative browsers on i-devices, yet they allowed Opera Mini. Hint? :) )

The issue of jSignature likely never working in Opera Mini aside, I cannot understand the viewport issue. I tried jSignature's demo page in: (1) Opera Mini on iPad, (2) Opera Mini on Android, (3) Opera Mobile on Android. The signature pad was rendered to size and in case #3 it actually worked (i could sign). When you saw the issues with viewport you report, was it on your pages or on jSignature's Demo page?

jSignature's Demo page uses 2 viewport instructions in the head tag, one tuned for mobile Androids, one for "others mobile" (Safari, Opera, Firefox, and Android as well if it ever switches to it). This combination proved to be the best guarantor of good cross-browser-compatible viewport scaling on mobile browsers. 

<!-- this is for mobile (Android) Chrome -->
<meta name="viewport" content="initial-scale=1.0, target-densitydpi=device-dpi" />
<!--  mobile Safari, FireFox, Opera Mobile. "device-HEIGHT" is intentional  -->
<meta name="viewport" content="initial-scale=1.0, width=device-height">

It's not specific to jSignature, so these are not discussed in the documentation. I feel like we should probably discuss this in the docs.

seanbamforth commented 12 years ago

Gah!

I probably meant Opera Mobile. The behaviour exhibited on Android devices. The issue reported was with our own code, but apart from the removal of modernizr, the code was exactly the same as yours.

I'll close the issue. Thanks for the response.

dvdotsenko commented 12 years ago

The issue of sig area being wider than 'screen' may still, by freak accident, be an issue caused by jSignature. JSignature tries to be smarty pants about sizing and listens to window resize events, looks at parent's size and rescales itself. I colud imagine situations where Parent sizing oddities (playing around withoverflow value on parents, pushing an absolutely position elem off the screen after 'redy' already fired) may cause jSignature to rescale too wide.

If you think there is a chance of jSignature scaling too far, shoot me example.