incubator-callback-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Joe Bowser (JIRA)" <>
Subject [jira] [Commented] (CB-1169) position:fixed does not update its positioning context when you rotate your phone
Date Wed, 01 Aug 2012 22:50:02 GMT


Joe Bowser commented on CB-1169:

It notices that the media is larger.  I don't apply the same style twice, instead the media
query forces the styles to be removed and reapplied on the resize.  I wish I could provide
you with more info, but this is handled by Android Webkit and not us. We don't do any tweaking
to how the Android WebView renders by default, and I can't find the code Google uses to make
this work in their browser.  
> position:fixed does not update its positioning context when you rotate your phone
> ---------------------------------------------------------------------------------
>                 Key: CB-1169
>                 URL:
>             Project: Apache Cordova
>          Issue Type: Bug
>          Components: Android
>    Affects Versions: 1.7.0, 1.8.0, 1.9.0, 2.0.0
>         Environment: Any android phone
>            Reporter: Nick Retallack
>            Assignee: Joe Bowser
>            Priority: Trivial
> This page demonstrates the problem:
> Open this page in Android Browser and notice that when you rotate your device, the red
square is always positioned in the far right corner.
> Now try running this page in phonegap.  If you load the page in portrait and rotate your
device to landscape, the red square stays in the middle of the bar.  If you load the page
in landscape and rotate to portrait, the red square stays offscreen.  I've included a refresh
link on the page so you can easily test this.
> I've verified the problem on many versions of phonegap on many versions of Android OS:
Froyo, Gingerbread, ICS, and even JellyBean.  Perhaps you need to change the way you poke
the page to reflow when the user rotates their phone.
> --- Notes on Work-arounds
> One way to work around this would be to use absolute positioning on both the header and
the scrollable content, and give the scrollable content overflow:auto.  Unfortunately, most
android phones do not support oveflow:auto so this would not work.  There are scrolling plugins
out there that attempt to work around this, but my content is virtually rendered (elements
are inserted and absolutely positioned in the scrollable area only when they should be visible)
and it does not play well with these plugins.  I suppose I could modify one.
> Another work-around is to position the content from the left instead of the right, and
update its position using JavaScript.  I've implemented that work-around here:

This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators:!default.jspa
For more information on JIRA, see:


View raw message