I have been searching for a solution to this and have been striking out.
I have a JQM/Phonegap app that has a search bar in a Fixed position header. OnKeyup, it hits my API and returns results in a listview that is dynamically created and refreshed.
What my issue is, is that although it looks fine in Chrome when I am testing it, once I build it in phonegap and test on the phone, when you click in the search bar, there’s an overlay on the box. Once you scroll through the results, this overlay moves both up and down, depending on your scroll.
I can provide code, but it’s really only showing when I build it and test on Android. (4.0.4)
I have tried adding data-tap-toggle="false" to the header and moving the search bar down to the “content” area and changing it to a data-filter="true" UL, with both options, I still get the “bouncing” search input.
Any other thoughts? I’ve attached an example of how it’s looking on the Android.
Another solution I found was to implement iscrollview https://github.com/watusi/jquery-mobile-iscrollview iscrollview is basically a library that integrates iscroll and jquery and it does all the nasty lifting for you.
After implementing this, the “bouncing” of the search box went away. YAY