Phonegap, jQuery Mobile, Android, not a fixed toolbar after entering text

Question

I have a problem with a combination of jQuery mobile, phonegap and android regarding toolbars. To be more precise, I would like both my header and footer to remain stable (data-position = "fixed") after entering text in the text area.

I also include the data-tap-toggle = "false" attribute in the header and footer, but after I wrote something in the text area and return to the page, the footer and header are no longer "fixed", and I should touch the screen again to be visible and corrected again.

Any tips? Thank you in advance.

Answer 1

Best solution (works great for me):

https://github.com/watusi/jquery-mobile-iscrollview

This is a combination of jquery mobile with iscroll. Basically, he does all the unpleasant work connecting the two libraries mentioned.

Answer 2

I have the same problem on iOS. After a few hours and having tried several different things, I went for iScroll . If there was another answer besides this, I would be glad to hear.

Answer 3

I had the same issue on Android 4.0.3. I had a list with a search box. As soon as I touch the search box for input, the header and footer have lost a fixed position. I have a very simple job for me.

$('input[data-type=search]').live("focus", function() { $("[data-role=header]").css('position','fixed'); $("[data-role=footer]").css('position','fixed'); }); 

Hope it works!