CODEWITHSUNDEEP
jqueryjquery-mobile
JQuery Mobile
JQuery Mobile

Reputation: 6291

Custom Header Buttons in JQuery Mobile

I am working on an application with JQuery Mobile. I need to use a custom image in a button that is used in a header bar. I'm not sure how to use a custom image though. I've reviewed the documentation found here: http://jquerymobile.com/demos/1.0.1/docs/toolbars/docs-headers.html.

My custom image is located at "/imgs/header/custom.png". How do I use this image in a button in the header of a JQuery Mobile application?

Thank you!

Upvotes: 1

Views: 2978

Answers (1)

Jasper
Jasper

Reputation: 75993

If you mean that you want to use a custom icon then you can do this:

CSS --

.ui-icon-custom {
    background-image: url(/imgs/header/custom.png) !important;
}

HTML --

<a data-icon="custom" href="#">Custom</a>

Source: http://jquerymobile.com/demos/1.0.1/docs/buttons/buttons-icons.html (the bottom of the page)

Upvotes: 3

Related Questions