Диалоговое окно jquery заменить значок кнопки закрытия

Question

Я хочу изменить стандартную кнопку закрытия в диалоговом окне jquery.

Я попытался добавить этот класс CSS в jquery-ui-1.8.23.custom.css:

.ui-icon-myCloseButton { background-image: url(/path/image.png); }

и в определениях диалога:

$('#documentsDialog').dialog({
   create: function(event,ui) {
           var widget = $(this).dialog("widget");
           $(".ui-dialog-titlebar-close span",widget).removeClass("ui-icon-closethick").addClass(".ui-icon-myCloseButton");

});

но не повезло, есть идеи?

Answer 1

Вам просто не хватало закрывающей фигурной скобки:

$('#documentsDialog').dialog({
    create: function(event, ui) {
        var widget = $(this).dialog("widget");
        $(".ui-dialog-titlebar-close span", widget).removeClass("ui-icon-closethick").addClass("ui-icon-myCloseButton");
    }
});​

Но, самое главное, ваш класс CSS должен быть объявлен как:

.ui-icon.ui-icon-myCloseButton{
    background-image: url(https://www.goldbroker.com/pages/images/close.png);
}​

Дело в том, что определение в.ui-icon переопределяло ваше пользовательское изображение. Когда вы переопределяете с помощью CSS выше, он полностью работает.

Здесь есть скрипка: http://jsfiddle.net/adrianonantua/FuWsK/2/