Landscape Orientation Change Iphone JS BUG

  • I noticed the center of view in portrait mode is correct always, when changing to landscape mode its ok for a split second and then screws itself up after a second wait.

    Normally, this is when it hides address bar, it appears that the viewport is larger than the screen size and is not centered but aligned towards the top showing you stretched content towards the top.

    This is on the beta versions as well as the release version.

    On the demo link https://krpano.com/tours/weingut/html5only.html, after a second wait, it didn't hide the address bar, but instead stretched to the left which was odd. Showing stretched content to the left.

    Iphone 4

    Is there an easy fix?

  • I am not seeing the issue you described. It takes a second to correct to the proper orientation but I believe it is due to a lack of good processor. Maybe it has something to do with the iOS version? I am using 4.3. Maybe I misunderstood your statement. However, for me on a iPhone 4 the address bar always disappeared.

  • Hey there:

    Sacha, no direct input from me regarding your issue... Sorry. But, I believe that the orientation change notification comes only -after- it's changed... so that might explain the lag time in updating the screen.

    From: need help creating action/plugin - ipad orientation

    Cheers,

    Patrick

    I'm using just the vanilla safari on the iphone 4, make tour multires droplet, but its visible on the html5 demo I mentioned.
    For instance I can center a hotspot and after I switch to landscape the fullscreen tour scrolls it out of site.
    Oddly enough, it doesn't happen when you show the same tour on ADD TO HOMESCREEN.
    I believe its something to do with the script to hide the address bar. Before it fires, everything looks normal.

    Guess, I'll try updating /reporting the ios installed.

    Edit... : ios 4.3
    It's odd, on orientationchange to landscape and after the hide address bar script has fired, there's no rhyme or reason to where the center of focus will be.
    It's something odd in however the address bar is hiding, I have previous non-krpano html5 tour that simply uses scrollto() for hiding the address bar and that works normal.

  • Updated to the latest ios. No change.

    Tried my tour, weignut tour and the other html5 demo.
    All tours have plugins that are aligned to the screen, once the orientationchange is made to landscape, these plugins are no longer visible, suggesting the viewport is larger than 100% of the screensize.
    Edit.. on the krpano kuchlerhous demo, the address bar is not hidden, but after the orientationchange, there's a second action where everything goes haywire.

  • Hey Sacha:

    Can you try one of the pano pages at my site (link in signature), and/or the one on the front page? Just curious to see what the behavior is. I'm using hand-edited embed code on the front page to go 100% width of browser window, and sized the DIVs (a la panoPress plugin for Wordpress) on the other pages. [update: testing locally with krpano default output, and it does exactly what you see on your end. using iPhone latest iOS, iphone4]

    Looks like some bad calculation of the window size,
    The resize script doesn't fire if you set this #pano manually.
    <div id="pano" style="width:300px; height:300px;">

    Hmmm... That makes sense. But, why is the krpano embed doing -anything- with the viewport? My instinct is that that falls into the area of design, and that things like krpano shouldn't mess with things like that. I personally find the hiding of the address bar to be annoying. *unsure*

    That said, it is probable that krpano as embedded at 100% IS calculating the window size properly -- as this is different from the viewport area -- but not properly accounting for the offset of window from viewport.

    Patrick

    QTVR • AS3 • 360° Photography • Art Gallery • Storefront • Books • Generative Art • ?

  • Well, any design which uses "fixed" positioning, or doesn't account for offset when moving the window around.

    Took me a while to get my head around how window and viewport interact. My Website had a couple elements at fixed position (top/left of window); in a browser on a desktop, this is great... not so when there's viewport involved (or if you care about IE6). :-P

    QTVR • AS3 • 360° Photography • Art Gallery • Storefront • Books • Generative Art • ?

  • I tested an ipad 1 and wasn't able to duplicate the effect, It simply appears that the iphone 4 is doing something twice.
    The first bump, things look 100% and snug, and then it bumps again.
    Probably matching a condition twice when it shouldn't.
    Did klaus go on vacation? He hasn't logged-in in awhile.

  • Turns out klaus wasn't able to replicate it on an iphone4.
    So after checking all system settings I found it.
    There's an accessibility setting "zoom" that allows a three fingered double tap. However with it on and not in use causes krpano not to return to the correct zoom in landscape.

  • I have the same problem, opening my tour in portrait display well every elements. Rotating to landscape display a larger viewport and many elements are displayed out of the screen.
    I try a classic fix for iphone, including in the metas initial-scale=1.0; maximum-scale=1.0. This generaly block any zooming effect. But in my case width Krpano it doesn't works
    So after rotation my screen is ugly, and i don't knows how to block the rotation.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!