CODEWITHSUNDEEP
androidjquery-mobilecordova
user2412555
user2412555

Reputation: 1055

JQuery-mobile popup scrolling not working on Android

I am using Phonegap with JQuery-mobile, I have a popup with a lot of text in it, it scrolls fine on iOS, but when I test on various Android versions, the scroll just doesn't work. It seems the popup is not listening to the scrolling events.

Here is a example of my setup, not exactly the same because I am using Backbone view to handle the loading of everything, but the final html should be similar.

my code setup more or less is like

<div data-role="page">
  <div data-role="header">...</div>
  <div data-role="content">
    <div id="scrollable_div">
       <div id="inner">
       <ul>
         .....
         ....
       </ul>
       </div>
    </div>
  </div>
  <div data-role="footer">...</div>
</div>
<div id="popup_wrapper">popup is loaded into this div programmatically and called popup</div>

http://jsfiddle.net/VRwLX/

Upvotes: 0

Views: 2716

Answers (1)

Urb Gim Tam
Urb Gim Tam

Reputation: 469

What if you try forcing a height to popup? Seems like Android is not being aware of the popup's size.

[data-role="popup"] {
    position: relative; // the parent container probably needs a position context also.
    height: 90%; //just not to block the full screen - it is a popup :)
    overflow-y: scroll;
}

Worked on my JellyBean Android stock browser, should behave similarly on Phonegap's webview.

If the above doesn't work, delete the position: relative and replace the height by a 'real' value (pixels) instead of a relative value.

Upvotes: 1

Related Questions