Puis-je définir une icône personnalisée pour un bouton jQueryUI

Question

Est-il possible de créer un bouton jQueryUI avec une icône personnalisée, à savoir: une icône qui ne fait pas partie des icônes d'image-objet fournies avec jQueryUI ???

J'utilise la fonctionnalité de Buttonset pour un groupe de 3 cases à cocher, mais besoin d'une icône plus stylisée que ce qui est prévu sur la boîte ...

Answer 1

avec elle travaillé un hack CSS.

le bouton Configuration selon la normale et donner l'icône primaire la classe définie ci-dessous

.Error 
{ 
    background-image: url('Images/Icons/16/Error.png') !important; 
} 

« Erreur » Le! Important redéfinit-ui icône background-image.

Answer 2

J'ai pris cette approche pour un de mes boutons et j'ai découvert des choses intéressantes:

1. Je n'ai pas besoin d'utiliser la commande prioritaire
2. je avais besoin de mettre en position de fond pour « important! » mon bouton (sinon je pense que l'arrière-plan était affiché bien en dehors du bouton)
3. Il semble que vous puissiez aussi mettre tout ce que vous voulez dans le nom de l'icône primaire de jQueryUI - il a juste besoin de quelque chose comme espace réservé.

Pour mes usages j'ai fini avec:

Javascript:

jQuery(function() { 
    jQuery('#share-button').button({ 
     icons: { primary: "icons/share" } 
    }); 

}); 

CSS:

#share-button > span.ui-icon { 
    background-image: url(icons/share.png); 
    background-position:0px 3px;} 

HTML:

<button id='share-button'>Share</button> 

bien