Add an image to the jquery button

Question

I am wondering how to add an image to the jquery button. Till now I was using the jquery ui button in my project and I got custom images from the graphics team, so I would like to implement them.

submit.button({ icons: {primary:'ui-icon-trash'}, text: false })

How to add custom image to this jquery button?

Answer 1

I would just assign a class to the button...

$("#buttonId").button({

    icons: {primary: null},
    text: false

}).addClass("ButtonClass");

Then your CSS class could look something like this...

.ButtonClass
{
    background-image: url(../images/Button.png);   
    background-repeat: no-repeat; 
    border: none;    
}