Categories
Development

Android Display Issues with jQuery Mobile and Cordova 3.5

Wow, I’ve been having all sorts of fits with a mobile app that I had created and how it was being displayed on Android devices with a very high pixel density display. I was really stumped for a while, on iOS it wasn’t having issues like that at all.

I had built this mobile app using Cordova 3.5 and jQuery Mobile. On a Android with a very high pixel density display the text in app was appearing super, super tiny. It was a pretty big difference, and an significant inconvenience.

After much research I did find a suggestion to change a setting on the viewport meta tag. Apparently if you set the target-densitydpi to medium-dpi things will display a bit better in varying Android devices/displays.

1
meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=medium-dpi, user-scalable=0"

While this doesn’t seem to scale as pretty as on iOS, it is much better than it was displaying before changing that to medium-dpi.

Leave a Reply

Your email address will not be published. Required fields are marked *