Могу ли я установить пользовательский значок для кнопки jQueryUI - PullRequest
8 голосов
/ 14 мая 2010

Можно ли создать кнопку jQueryUI с пользовательским значком, т. Е. Значком, который не является частью значков спрайтов, которые предоставляются с jQueryUI ???

Я использую функциональность ButtonSet для группы из 3 флажков, но мне нужен более стилизованный значок, чем тот, который предоставляется из коробки ...

Ответы [ 2 ]

9 голосов
/ 14 мая 2010

Работал с CSS-хаком.

Настройте кнопку как обычно и присвойте первому значку класс «Ошибка», определенный ниже

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

Параметр! Важный отменяет определение значка пользовательского интерфейса для фонового изображения.

4 голосов
/ 18 марта 2012

Я выбрал этот подход для одной из моих кнопок и обнаружил некоторые интересные вещи:

  1. Мне не нужно было использовать "! Важное" переопределение
  2. Мне нужно было установить положение фона для моей кнопки (в противном случае я думаю, что фон отображался далеко за пределами кнопки)
  3. Похоже, вы также можете поместить все, что вам нравится, в имя основного значка jQueryUI - ему просто нужно что-то как заполнитель.

Для моего использования я получил:

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>
...