views:

2798

answers:

4

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!

A: 

This wont work if you are running a web-app in safari, but I think it will work if you are using a UIWebView inside your own app.

I havent tested this, but there is an easy way to get your javascript to talk to the objective-c side of the code at which point you would have access to things like the zoom of the web view.

coneybeare
what will work if you're using a UIWebView? Did I miss something? Can you zoom a UIWebView from cocoa?
3n
I guess I misread the question. What I describe is a solution if the app is using an "internal safari" or a UIWebview.
coneybeare
Coneybeare, this is a web app, and I think you are right. After many, many hours of experimentation, I can't get it to work. It seems like something Safari on an iPhone should be able to support. Oh well. Maybe someday...
dwarbi
A: 

I'm sorry, but I don't know how to post a comment. There is no visible button or link that I can see so it's going here...

@coneybeare You said that if you use a uiwebview then you can access the zoom. What property allows this? I can't find any js window property that gives me the right value. Did you have some sort of idea already in mind for this, or was it just a thought?

casey
It looks like I can add a comment to my own post but no other...strange
casey
+1  A: 

Try this:

<meta name="viewport" content="width=device-width; initial-scale=1.0; user-scalable:no;">
ekob
A: 

I had this issue too I think. Try putting a "maximum-scale=1.0" (and maybe a "minumum-scale=1.0" if you feel like it) in your viewport tag. This assumes you don't want the user to be able scale though (which I don't)

half_brick