Search jQuery

jQuery Forum

Icons appear as round blobs on Galaxy Y

in jQuery Mobile • 8 years ago

Hi, I have a phonegap application that is using jQuery mobile. Everything looks good with my Galaxy S2, but when I test it on my Galaxy Y, all the icons just appear as round blobs.

Replies(6)

watusiware

Re: Icons appear as round blobs on Galaxy Y

8 years ago

What version of jQuery Mobile? What version(s) of Android?

If using jQuery Mobile 1.4.x, what icon support did you include? If you use the standard .css file, it should already include support for both SVG and PNG icons.

Older Android browsers do not support SVG. You need at least 4.1 and 4.4 for full support.

http://caniuse.com/#feat=svg

Does the jQuery Mobile online demo display correctly on your Galaxy Y?

graham

Re: Re: Icons appear as round blobs on Galaxy Y

8 years ago

Many thanks for that. I was using jqm 1.4.2 and the standard default themed css, which should have worked I would have thought. However, as soon as I upgraded to 1.4.5, all was good :-)

Thanks for your help.

Cheers

Graham

watusiware

Re: Icons appear as round blobs on Galaxy Y

8 years ago

I'll bet you didn't copy the images directory when you installed 1.4.2. With the standard CSS, it is only used if the browser does not support SVG.

Always check the console log for error messages! (In this case, it would be good to test on a desktop emulator. With Android 4.x, you can view the console log remotely on a real device with a USB cable and desktop Chrome.)

graham

Re: Re: Icons appear as round blobs on Galaxy Y

8 years ago

You're dead right, that's exactly what I didn't do! When I reported that it was working under 1.4.5, I was using the Google CDN. When I copied the two files to local and it didn't work again, I realised from your post that I needed the image directory as well.

I'm interested in the console log debugging approach you mentioned. Could you point me to anything that would assist me in setting that up?

Thanks

Graham

watusiware

Re: Icons appear as round blobs on Galaxy Y

8 years ago

I'm interested in the console log debugging approach you mentioned.

It's much more than console.log...

iOS: (iOS 5 or higher)

http://appletoolbox.com/2014/05/use-web-inspector-debug-mobile-safari/

https://developer.apple.com/safari/tools/

Android: (4.0 for browser, 4.4 for embedded WebView)

https://developer.chrome.com/devtools/docs/remote-debugging

http://www.html5rocks.com/en/tutorials/developertools/mobile/

Android (older devices) or any device with Javascript

http://people.apache.org/~pmuellr/weinre-docs/latest/

Weinre provides inspection tools that can be used on older devices, but lacks any ability to forward the console log. I've used this for that purpose:

http://jsconsole.com/remote-debugging.html