You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@cordova.apache.org by "Nick Retallack (JIRA)" <ji...@apache.org> on 2012/08/01 21:42:04 UTC
[jira] [Created] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Nick Retallack created CB-1169:
----------------------------------
Summary: 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.9.0, 1.8.0, 1.7.0, 2.0.0
Environment: Any android phone
Reporter: Nick Retallack
Assignee: Joe Bowser
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.
--
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
[jira] [Commented] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Nick Retallack (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426968#comment-13426968 ]
Nick Retallack commented on CB-1169:
------------------------------------
So you use media queries to re-apply the same style twice?
> 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
[jira] [Commented] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Joe Bowser (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426974#comment-13426974 ]
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: 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
[jira] [Comment Edited] (CB-1169) position:fixed does not update
its positioning context when you rotate your phone
Posted by "Nick Retallack (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426968#comment-13426968 ]
Nick Retallack edited comment on CB-1169 at 8/1/12 10:36 PM:
-------------------------------------------------------------
So you use media queries to re-apply the same style twice? Does the browser not notice they are the same?
was (Author: nickretallack):
So you use media queries to re-apply the same style twice?
> 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
[jira] [Commented] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Nick Retallack (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426945#comment-13426945 ]
Nick Retallack commented on CB-1169:
------------------------------------
Sorry, I don't quite understand your work-around. What makes this work?
> 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
[jira] [Updated] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Nick Retallack (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]
Nick Retallack updated CB-1169:
-------------------------------
Description:
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
was:
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.
> 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
>
> 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
[jira] [Commented] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Joe Bowser (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13426951#comment-13426951 ]
Joe Bowser commented on CB-1169:
--------------------------------
Media queries force the style to be re-applied to the document when the document is resized. This application doesn't appear to suffer from the same issues as your example where the styles aren't being re-applied.
> 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
[jira] [Comment Edited] (CB-1169) position:fixed does not update
its positioning context when you rotate your phone
Posted by "Joe Bowser (JIRA)" <ji...@apache.org>.
[ 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. This works back to Android 2.3 at the very least.
https://github.com/infil00p/oscon-demo
was (Author: bowserj):
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
> 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
[jira] [Comment Edited] (CB-1169) position:fixed does not update
its positioning context when you rotate your phone
Posted by "Joe Bowser (JIRA)" <ji...@apache.org>.
[ 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
[jira] [Updated] (CB-1169) position:fixed does not update its
positioning context when you rotate your phone
Posted by "Joe Bowser (JIRA)" <ji...@apache.org>.
[ https://issues.apache.org/jira/browse/CB-1169?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]
Joe Bowser updated CB-1169:
---------------------------
Priority: Trivial (was: Major)
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