https://github.com/scottjehl/iOS-Orientationchange-Fix

A fix for the iOS orientationchange zoom bug.
https://github.com/scottjehl/iOS-Orientationchange-Fix

Last synced: 4 months ago
JSON representation

A fix for the iOS orientationchange zoom bug.

• Host: GitHub
• URL: https://github.com/scottjehl/iOS-Orientationchange-Fix
• Owner: scottjehl
• Created: 2012-01-06T03:54:07.000Z (almost 13 years ago)
• Default Branch: master
• Last Pushed: 2018-12-29T23:49:38.000Z (almost 6 years ago)
• Last Synced: 2024-05-02T01:09:10.522Z (8 months ago)
• Language: JavaScript
• Homepage:
• Size: 164 KB
• Stars: 772
• Watchers: 60
• Forks: 116
• Open Issues: 12
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
A fix for the iOS orientationchange zoom bug.

=======================

Authored by @scottjehl, rebounded by @wilto.

MIT / GPLv2 License.

Demo: http://scottjehl.github.com/iOS-Orientationchange-Fix/

Minified src:

	/*! A fix for the iOS orientationchange zoom bug. Script by @scottjehl, rebound by @wilto.MIT / GPLv2 License.*/(function(a){function m(){d.setAttribute("content",g),h=!0}function n(){d.setAttribute("content",f),h=!1}function o(b){l=b.accelerationIncludingGravity,i=Math.abs(l.x),j=Math.abs(l.y),k=Math.abs(l.z),(!a.orientation||a.orientation===180)&&(i>7||(k>6&&j<8||k<8&&j>6)&&i>5)?h&&n():h||m()}var b=navigator.userAgent;if(!(/iPhone|iPad|iPod/.test(navigator.platform)&&/OS [1-5]_[0-9_]* like Mac OS X/i.test(b)&&b.indexOf("AppleWebKit")>-1))return;var c=a.document;if(!c.querySelector)return;var d=c.querySelector("meta[name=viewport]"),e=d&&d.getAttribute("content"),f=e+",maximum-scale=1",g=e+",maximum-scale=10",h=!0,i,j,k,l;if(!d)return;a.addEventListener("orientationchange",m,!1),a.addEventListener("devicemotion",o,!1)})(this);	

Instructions: 

Include the script, enable your zooms. (I'll fill that out more later...).

How it works:

This fix works by listening to the device's accelerometer to predict when an orientation change is about to occur. When it deems an orientation change imminent, the script disables user zooming, allowing the orientation change to occur properly, with zooming disabled. The script restores zoom again once the device is either oriented close to upright, or after its orientation has changed. This way, user zooming is never disabled while the page is in use.