I have a interesting problem with position: fixed in Opera Mobile 11:
Test page: http://dl.dropbox.com/u/841468/testcase/opera/fixed.html
The red <div>
should stay fixed on top. If I scroll page down, element moves a bit from top edge of viewport (exa开发者_C百科ctly 93px in device pixels); but if I scroll up, element returns to correct position.
(Screenshot on HTC Desire):
My findings:
- Changing zoom level didn't help and didn't change element position from top edge.
- It works correctly in Opera Mobile emulators (both 10.1b and 11)
- Setting or removing "top" / "left" properties didn't help
- Setting "z-index" or "display" properties to some value didn't fixed it
- It shows this behavior even when I move viewport with
window.scrollTo(x, y)
- Setting "zoom" to "reset" didn't work
- Mouse events get through this element to element under it (if it is in that incorrect position)
- Trying IE hacks didn't work :)
Thanks
This issue has been fixed internally, and the Opera Mobile 11.5 version should roll out with this working correctly.
Unfortunately there is no fix for this, it seems to be a known bug at Opera and they are working on it. I worked around this bug by using a little Opera specific CSS hack and putting the div to position absolute in the mean time:
noindex:-o-prefocus, div { position: absolute; }
It is a known issue at Opera and we are actively working on a fix. It is though a complex issue involving the painting when rendering.
精彩评论