Message from discussion
Preventing landscape view
Received: by 10.35.16.7 with SMTP id t7mr3938671pyi.1194374691116;
Tue, 06 Nov 2007 10:44:51 -0800 (PST)
Return-Path: <s...@stevefink.net>
Received: from nz-out-0506.google.com (nz-out-0506.google.com [64.233.162.227])
by mx.google.com with ESMTP id x46si5828186pyg.2007.11.06.10.44.48;
Tue, 06 Nov 2007 10:44:51 -0800 (PST)
Received-SPF: neutral (google.com: 64.233.162.227 is neither permitted nor denied by best guess record for domain of s...@stevefink.net) client-ip=64.233.162.227;
Authentication-Results: mx.google.com; spf=neutral (google.com: 64.233.162.227 is neither permitted nor denied by best guess record for domain of s...@stevefink.net) smtp.mail...@stevefink.net
Received: by nz-out-0506.google.com with SMTP id m22so1247228nzf
for <iphonewebdev@googlegroups.com>; Tue, 06 Nov 2007 10:44:48 -0800 (PST)
Received: by 10.142.111.14 with SMTP id j14mr1741900wfc.1194374688573;
Tue, 06 Nov 2007 10:44:48 -0800 (PST)
Received: by 10.142.86.3 with HTTP; Tue, 6 Nov 2007 10:44:48 -0800 (PST)
Message-ID: <e9aa62150711061044p47477656v8bd52dda59b8e1df@mail.gmail.com>
Date: Tue, 6 Nov 2007 13:44:48 -0500
From: "Steve Finkelstein" <s...@stevefink.net>
To: iphonewebdev@googlegroups.com
Subject: Re: Preventing landscape view
In-Reply-To: <A19BB9C2-7C72-4ABC-9D85-70817B36A332@mac.com>
Mime-Version: 1.0
Content-Type: text/plain; charset=ISO-8859-1
References: <e9aa62150711060839w72ea4ec3j6fe7918217a84a73@mail.gmail.com>
<7515FB15-2D10-4841-A99E-6EC6C76830D5@mac.com>
<e9aa62150711060910w64292e5fn9a08899c5525010f@mail.gmail.com>
<A19BB9C2-7C72-4ABC-9D85-70817B36A332@mac.com>
Thanks august. :-)
And yeah, I just found out myself that window.orientation is a
read-only property. Try to cancel the Event during the capturing phase
isn't workable either.
Time to write additional CSS!
- sf
On 11/6/07, August Trometer <blue...@mac.com> wrote:
>
> Good try, but I think window.orientation is something that the browser
> sets, and you can't affect it with code.
>
> What I was suggesting is something more like:
>
> function orientationChanged() {
>
> if ( window.orientation == '90' || window.orientation == '-90' ||
> window.orientation == '180' )
> document.body.className = 'landscape';
> else
> document.body.className = 'portrait';
> }
>
> Then, in your CSS, you can have different styles for elements in
> portrait or landscape mode.
>
> Depending on what, exactly, you're trying to do, though, Randy is
> right: it's simpler just to use percents, i.e. 100%, etc. as width
> parameters. This allows your page to display regardless of orientation.
>
> Also keep in mind that it's quite possible (I'd say likely) that Apple
> will release an "iPhone HD" with, say, a 240 pixels per inch display,
> or the again-rumored table with who-knows- how-many-pixels. Anything
> based on 320 pixels wide will need reworked. By using %s, you can keep
> yourself from having several versions of the same site.
>
> August
>
>
>
>
> On Nov 6, 2007, at 12:10 PM, Steve Finkelstein wrote:
>
> >
> > Thanks August..
> >
> > I'm having a bit of difficulty panning the view back into portrait ..
> > if any suggestions to the following code can be made it would be
> > totally wonderful... I figured it would do the trick, but apparently
> > not. :-)
> >
> > function orientationChanged() {
> >
> > if ( window.orientation == '90' || window.orientation == '-90' ||
> > window.orientation == '180' )
> > /* flip back to portrait view. */
> > window.orientation = 0;
> > alert(window.orientation);
> > }
> >
> > - sf
> >
> > On 11/6/07, August Trometer <blue...@mac.com> wrote:
> >>
> >> You can't prevent landscape mode, but you can detect it, then adjust
> >> your page as necessary. iPhone 1.1.1 introduced the
> >> "onorientiationchange" JavaScript event. You can use it like this:
> >>
> >> <body onorientationchange="orientationChanged()">
> >>
> >> Then in orientationChanged() look at the window.orientation property
> >> to determine the orientation of the screen. You can then set CSS
> >> properties accordingly.
> >>
> >> As far as input boxes, if you use a form element name that uses 'zip'
> >> in it, a numerical input box will be used. For example:
> >>
> >> <input type="text" name="thisisnotazip" size="20" />
> >>
> >>
> >> Good luck!
> >>
> >> August
> >>
> >>
> >>
> >>
> >>
> >> On Nov 6, 2007, at 11:39 AM, Steve Finkelstein wrote:
> >>
> >>>
> >>> Hi folks,
> >>>
> >>> I was curious if anyone had a code snippet to prevent landscape view
> >>> from happening in an application? I currently haven't optimized my
> >>> CSS
> >>> to propagate if the phone gets tilted 90 degrees and would like to
> >>> prevent landscape view from creeping up.
> >>>
> >>> Also, one other question, is it possible to force only a numerical
> >>> keyboard to come up for certain input boxes?
> >>>
> >>> Thanks for the help. :-)
> >>>
> >>> - sf
> >>>
> >>
> >>>
> >>
> >
> > >
>
>
> >
>