Improved version of JavaScript fix for the iOS viewport scaling bug. See http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/ , also http://adactio.com/journal/4470/

  • Download Gist
iphone-viewport-scaling-bug-fix.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
(function() {
 
var metas = document.querySelectorAll('meta[name="viewport"]'),
forEach = [].forEach;
 
function fixMetas(firstTime) {
forEach.call(metas, function(el) {
el.content = firstTime
? 'width=device-width,minimum-scale=1.0,maximum-scale=1.0'
: 'width=device-width,minimum-scale=0.25,maximum-scale=1.6';
});
}
 
fixMetas(true);
 
document.body.addEventListener('gesturestart', fixMetas, false);
 
}());

I’d love to re-use the argument var instead of creating a new one (scales), but I can’t think of a flexible enough variable name. :)

@mathiasbynens Perhaps just re-use the passed firstTime variable instead of creating the new scales? :P

@cheeaun Yeah that’s what I’m talking about. I’d have to rename the variable for clarity though, and I can’t think of a good name that makes sense.

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.