Search jQuery

jQuery Forum

orientationchange event and Iphone

in jQuery Mobile • 11 years ago

Hi,
I tried to hook up the "orientationchange" event to "remodel" the landscape view and got it to work with help from a forum member. It worked out in some contexts: Dreamweaver liked it (Live view), Device Central liked it, Android..;

    but NOT for the IPHONE. It just does not respond.

So I did it differently but not exactly optimal using the "resize" method on the "window". It looks like this:
$(document).ready(function() {
...
$(window).resize( function() {
           if ($(window).width() > 320 ) {
             // change your page stuff for landscape here (JQ manipulation)
           } else {
            // change your page stuff back for portrait here (JQ manipulation)
       }
    });
...
});
It is very basic and it works in the Iphone but the test on window width is far from optimal.

So, again, could there be a bug somewhere preventing the "orientationchange" event for some device contexts to work.
Is there another optimal way around this problem perhaps kicking off things with the "pseudo" event "trigger"?

I am just halfway happy so far.

Regards
/Ralf

Replies(5)

frequent

Re: orientationchange event and Iphone

11 years ago

This works for me:

$(window).bind('orientationchange resize', function(event){
      if(event.orientation) {
            if(event.orientation == 'portrait') {
		  // do something
	          } else if (event.orientation == 'landscape') {
                       // do something else 
                       } 
            } else {
                  // optional... PC-version javascript for example
                  }

      });

What I noticed is that:

```
$(window).trigger('orientationchange');
```

somehow does not fire, so I always trigger with resize.

Rgs

Frequent

raffeg

Re: Re: orientationchange event and Iphone

11 years ago

Thanks Frequent,

I will try it out.

Yours is close to mine earlier attempt where I tried a pure "orientationchange" as event type.

Do you know what other flavours of "orientationchange" there are apart for "orientationchange resize"? I do have problems finding things in the documentation that many times is both sufficient and cursory. Is this documented somewhere?

Regards
/Ralf

raffeg

Re: Re: orientationchange event and Iphone

11 years ago

Hello again Frequent,

Yes, i just verified it. It is working.

Thanks,

What is reason you testing on existentance/definition:

"if ( event.orientation )"?

Please don't forget my other questions previously sent,

Rgds

/Ralf

frequent

Re: orientationchange event and Iphone

11 years ago

Hi Ralf,

good to hear it's working. Regarding your questions:

#2 why use if(event.orientation) = I copied the above snippet together. The orientation check is part of a function which I call on orientationchange/resize and also on click/changePage. With the check I can differentiate according to events. Also, if a device does not support orientation (I'm doing a mobile-pc site) I'm at the optional else-statement (see above), where I also use width() to remodel my site for PC - I'm using the function on a multipage with normal and splitview pages combined, so I need to check on every changePage/click, resize and orientationchange, which splitview version I need to display.

#1 what do you mean by "flavours". Perhaps in German :-) I was sitting over a script for a while wondering why trigger (orientationchange) was not firing. When I put in resize instead it worked, so I have been sticking with it since.

Rgs,

Frequent

raffeg

Re: Re: orientationchange event and Iphone

11 years ago

Hi Frequent,

In my writing "flavors" was supposed hint on "variants". Why did I say that: because I thought that the event name was "orientationchange" only and when I saw "orientationchange resize" I thought that that would be a variant of the "prototype" or an odd way of parameter passing. Besides, I have never seen the construct before so I was puzzled and I still am.

You said: "When I put in resize instead...", well as I see it you added "resize" to sit beside "orientationchange". What did you mean by "instead"?

I seem that we are on the same developer track both of us. I started off with mobile webs and then had a customer that expressed that "apps" were "cooler" than webs. Well the thing is that the webs I been developing fetches data from a cloud db so there is some cloud (PHP) processing involved, client AJAX etc. Wasn't so keen on the idea of putting the systems in a "prison" until I saw the benefits of developing things like games for the app stores (making my retirement).

Now, I am seeing that it may be impossible to maintain one developing line for both web, tablets and smartphones as there is so much "cool" things I can do scaling up image density (and other stuff only found in the mobile world) considering the portables devices awesome screens and lesser dependency of the "cloud". I am not very keen on the complexity imposed by media queries.

Rgds
/Ralf

Top Reply

Response title

Attachments

jQuery Forum

orientationchange event and Iphone

Replies(5)

Re: orientationchange event and Iphone

Re: Re: orientationchange event and Iphone

Re: Re: orientationchange event and Iphone

Re: orientationchange event and Iphone

Re: Re: orientationchange event and Iphone

Statistics

Tags

Actions