CODEWITHSUNDEEP
cssmedia-queriesresponsive-design
mvod
mvod

Reputation: 135

CSS media queries: wrong viewport scale on iPad

If you change ipad position from portrait to landscape viewport scale will be wrong (site is to big for viewport). I've searched a lot and found the same problem on lessframework.com

Take a look — http://www.youtube.com/watch?v=MGDjaE-eKAY

But there is no problem on stuffandnonsense.co.uk/projects/320andup/

I can't find out what makes 320andup working right and lessframework.com working wrong on ipad.

Any ideas?

Upvotes: 3

Views: 822

Answers (1)

Gerben
Gerben

Reputation: 16825

I view-sourced if for you

if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
  var viewportmeta = document.querySelectorAll('meta[name="viewport"]')[0];
  if (viewportmeta) {
    viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0';
    document.body.addEventListener('gesturestart', function() {
      viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6';
    }, false);
  }
}

Upvotes: 4

Related Questions