Question

jQuery mobile: can I do header/footer really css fixed (like css position:fixed)?

To fix header and footer i tried to use jquery-mobile’s data-position=”fixed”

But it looks like ugly on the phone: when I scroll, it appears, disappears and blinks, hm.. that is not what fixed mean to be in css if set header style to: style=”position:fixed;z-index:1000″ it looks much better – it just fixed and that is all

Is there a way to do it out of the box?

Answer 1

All your questions why this happens and how to fix it: http://jquerymobile.com/test/docs/toolbars/bars-fixed.html

For archiving:

Known limitations

jQuery Mobile uses dynamically re-positioned toolbars for the fixed header effect because very few mobile browsers support the position:fixed CSS property

True fixed toolbars: touchOverflowEnabled

In order to achieve true fixed toolbars, a browser needs to either support position:fixed or overflow:auto. Fortunately, this support is coming to mobile platforms so we can achieve this with web standards. In jQuery Mobile, we have added a global feature called touchOverflowEnabled that leverages the overflow:auto CSS property on supported platforms like iOS5. When enabled, the framework wraps each page in a container with it’s own internal scrolling