What's the best way to put an image on a button?

[pallenMember]

I don’t see in the demo’s an example of having an image on a button, which I think is a common use case and one that I need in a current project. Can you describe the best way to accomplish this?

[Peter StoevKeymaster]

Hi pallen,

In order to create a Button with Image, you need to use a DIV instead of INPUT tag.

The following is a HTML markup for a button with image.

<div style="width: 100px; height: 25px;" id='jqxButton'>
    <img style='float: left; margin: 4px;' src='../../images/numberinput.png' />
    <div style='float: left; margin: 4px;'>
        Button</div>
</div>

The script that creates the button is:

 $("#jqxButton").jqxButton();

Hope this helps you.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts