How do I stop iPhone Safari from dynamically resizing the visual viewport?

Question

How do I stop iPhone Safari from dynamically resizing the visual viewport?

Sorry I post this here, but I couldn't access the developer forums (no error given, it just keeps returning me to this page https://developer.apple.com/devforums/) I'm not even sure wether that's been moved here and it's just the redirection non working.

I need to Stop iPhone Safari from dynamically resizing the visual viewport, or in other words, to stop it from trying to "fit" the layout into the viewport.

Why?

Because any recalculation javascript does on absolutely positioned elements makes the whole site super IRRESPONSIVE.

I don't know wether the issue is the element going out the already-set layout viewport (which triggers the page resizing to fit the visual viewport) or just the calculations being made constantly, but I can stop the calculations from happening when not "touching" the screen, but I need a way to stop the page resizing.

I tried setting the viewport width to 1040px, as my layout width, and it fixed the header's width being narrower than the body (or shifted left?), but the whole page is still resized with every motion-frame (one every 3 seconds, due to overloading the redrawing engine)

Is there a way to prevent that?

MacBook Pro, Mac OS X (10.6.8)

Posted on Apr 29, 2012 2:01 PM

Reply

Answer 1

May 2, 2012 12:29 AM in response to applxperience

Was actually looking for a way to stop the iPad from doing this itself but it's done using the viewport so the developer can only set it, which isn't any use to me since I'm not the dev. Having the same problem and it's irritating as **** lol.

Came across this thread that may help you, http://stackoverflow.com/questions/697748/iphone-safari-is-there-a-way-to-stop-r esizing-the-page-on-load

Basically you can set the viewport to detect the device resolution and set the size accordingly, not done any web dev for iOS specifically so I'm not sure if this will help you with your problem but I'm experiencing a lot of lag as the page gradually gets bigger with added content and the iPad zooming out to fit it all to screen.

Reply

Answer 2

May 2, 2012 1:46 AM in response to Bryann2012

No, that link doesn't solve it. It just says the same is found everywhere online.

There's probably no way to do it, as per their way they "accidentally" omitted the oposite case: the page being wider than 980. They only mention what to do if the site is narrower. Something I learned is big companies (with reputation management) could let you run in circles for years no answer rather than telling you something is not possible.

I'm the developer (can't access the dev forums, don't know why) and I DID setup the viewport, scale and other properties but none of them stopped from re-fitting the new re-sized layout in the viewport. They just ensure the "initial" view.

I think the feature I'm looking for must be achieved with some JavaScript function targeting Safari-proprietary variable/property… if even possible.

I just had to make things never reaching the edge until somebody contributes something useful 😟

Reply