ui-icon-alt about jquery-mobile-icon-pack HOT 4 CLOSED

Could you provide some additional detail please @Slimicus? A code sample or demo URL would be ideal.

from jquery-mobile-icon-pack.

Sure thing, when I alter the original\index.html sample to this:

<a href="index.html" data-role="button" data-icon="arrow-l" class="ui-icon-alt">
    data-icon="arrow-l"
</a>

(notice the addition of class="ui-icon-alt")

This happens:

http://i.snag.gy/eaXQm.jpg

from jquery-mobile-icon-pack.

jQuery Mobile icons work on the concept of sprite sheets. That means all of the icons are contained within a single image, for faster loading. Since they're all in one image they're meant to be used within a single space around 20x20, with overflow set to hidden. This prevents them from doing exactly what's happening to you.

This image is a good illustration of how sprite sheets are meant to work. The image contains all of the icons, but only one is being used at a time, contained within the black box.

So, long and short of it, you can't just apply that class to the anchor tag like you can with some of the other jQuery Mobile styles.

from jquery-mobile-icon-pack.

Ok, I just followed the example on the jqm site, I wasn't aware of any other way to use ui-alt-icon with an anchor tag in jqm?

http://jquerymobile.com/demos/1.3.0/docs/widgets/icons/#Blackvs.whiteiconsets

Their example shows just adding the class to the "<a"

from jquery-mobile-icon-pack.