Question

42

Reset scale/width/zoom of Safari on iPhone using JavaScript/onorientationchange

rated 0 times [ 45] [ 3] / answers: 1 / hits: 26742 / 15 Years ago, wed, september 16, 2009, 12:00:00

I am displaying different content depending on how the user is holding his/her phone using the onorientationchange call in the body tag. This works great - I hide one div while making the other visible.

The div in portrait mode looks great on first load. I use this to get the right scale/zoom:

<meta name=viewport content=width=device-width; initial-scale=1.0; maximum-scale=1.0; />

Even if the content in portrait mode run over, the width is correct and the user can scroll down. The display in landscape mode is perfect too. However, if content in landscape mode requires the user the scroll down, then when the user returns to portrait mode, the screen is zoomed out so to speak. This happens whether or not the user scrolled down while in landscape mode.

I've tried many different things to try to get the scale/zoom/width of the screen right, but no luck. Is there any way to do this?

Thanks in advance!

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

alfredoc

Add To Favorites

Follow

Total Points: 261

Total Questions: 128

Total Answers: 89

Location: French Polynesia

Member since Sun, Aug 2, 2020

4 Years ago

answered 15 Years ago brodyfrancisi · Accepted Answer

Here is what I use to deal with the zoom on my media-queries:

<meta name=viewport content=width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;>

The maximum-scale is the thing that sold it for me. It means the transition from portrait to landscape on an iphone is really smooth with no zoom problems at all...