[
https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426873#comment-13426873
]
Joe Bowser edited comment on CB-1169 at 8/1/12 8:57 PM:
--------------------------------------------------------
CSS Media Queries DO get around this problem. Check out my OSCON 2012 demo for
an example of position:absolute inside position:fixed.
https://github.com/infil00p/oscon-demo
was (Author: bowserj):
CSS media queries should get around this issue, since they update the style
when the screen is resized.
> position:fixed does not update its positioning context when you rotate your
> phone
> ---------------------------------------------------------------------------------
>
> Key: CB-1169
> URL: https://issues.apache.org/jira/browse/CB-1169
> 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:
> http://nickretallack.com/experiments/phonegap/fixed.html
> 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: http://nickretallack.com/experiments/phonegap/jsfixed.html
--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators:
https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira
