Databases
StackOverflow2013
Postsdbo
POPhonegap 2.8 Position: fixed is not working properly
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPhonegap 2.8 Position: fixed is not working properly
    text
    copied!<p>After spending 16 hours and having sacrificed critters to various gods I must regretfully say that I'm on the verge of mental meltdown. </p> <p>I am writing an PhoneGap 2.8 application for Android (in the future will port to iOS). As main frameworks I use jQuery (with many plugins), Require, Underscore and Backbone. On one fatal morning I got a task that header menu of my application must "imitate" the way facebook app's header does (follow the scroll). </p> <p>Initially I believed that adding "position:fixed" attribute to the header div would would be simple enough- have I never been more wrong. As it turns out, position:fixed css attribute doesn't work properly in WebView and the issue has endured for years now. This issue has been discussed in length in various forums and articles and various "solutions" have been proposed- none are working in my case.</p> <p>I have tried to set header's position to fixed when scrolling and to absolute when scrolling is done. Theoretically it works, but it is laggy. Having tried that I looked into different plugins or frameworks that could help in the case. iScroll - Forces a specified structure to html and severe lack of documentation threw me away from it. jQueryMobile - Since it is a whole framework, integrating it to my project would mean changing alot of stuff. As I understand, it wont provide a persistent header. </p> <p>I have heard of Bartender and GloveBox but neither of them have documentation and they aren't in constant development (last commits are > year old ). </p> <p>Using jsHybugger I inspected the header when it is in position: fixed an I have noticed that Blue box that overlays a div being selected in inspector is staying where click area is for the header. So if I scroll, the header moves with viewport but hitarea stays in place. It got me wondering, if there is a way to force WebView to recalculate the click area? </p> <p>All and any help is very much appreciated. </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload