Greg
Greg

Reputation: 47164

How to Re-Enable Zoom on iPhone with Javascript (Bookmarklet)

I'm trying to code up a bookmarklet I can use on my iPhone to re-enable zoom on sites that have disabled it.

So far I found this bookmarklet someone already made with this javascript:

(function() {
    var metaElements = document.getElementsByTagName('meta'),
        i            = metaElements.length,
        el;

    while (i--) {
        el = metaElements[i];
        if (el.name.toLowerCase() == 'viewport') {
            el.parentNode.removeChild(el);
        }
    }
})();

and I found a page to test it out on.

But it doesn't seem to do anything when I run it on my iphone.

Any ideas what it needs to work? Is there something here not compatible with Safari?

Upvotes: 1

Views: 463

Answers (1)

sha1
sha1

Reputation: 555

Apparently removing the viewport meta tag doesn't work, rather it has to be changed. This should re-enable zoom:

(function() {
   var metaElements = document.getElementsByTagName('meta'),
    i            = metaElements.length,
    el;

   while (i--) {
      el = metaElements[i];
      if (el.name.toLowerCase() == 'viewport') {
        el.content = "user-scalable=1, initial-scale=1, maximum-scale=100";
      }
   }
})();

and as a bookmarklet: javascript:(function(){var e=document.getElementsByTagName("meta"),t=e.length,n;while(t--){n=e[t];if (n.name.toLowerCase()=="viewport"){n.content="user-scalable=1, initial-scale=1, maximum-scale=100;";}}})();

WARNING: Stackoverflow might be adding invisible characters to that bookmarklet, if it doesn't work try removing them.

Upvotes: 2

Related Questions