Диалоговое окно JQuery без полей с кнопкой закрытия

0

Как создать диалоговое окно интерфейса jQuery без полей, но удерживайте кнопку "Закрыть" и сделайте кнопку пурпурной? Кнопка закрытия по умолчанию находится в правом верхнем углу.

  • 0
    посмотрите демо и исходный код ...
Теги:

2 ответа

1
Лучший ответ

после того, как по умолчанию ui css разместите свой css таким образом, btw загляните в исходный код демо.

            /* DIALOG MAIN CONTAINER */
    .ui-dialog.ui-widget-content {
        border:none;    
    }
            /* STYLE AROUND THE CLOSE (X) BUTTON */
    .ui-dialog-titlebar-close.ui-state-default, 
    .ui-dialog-titlebar-close.ui-state-hover {
        outline:none;
        background: none;
        border:none;
    }
            /* DIALOG TITLE BAR */
    .ui-dialog .ui-widget-header {
        border:0;
        background:none
    }
            /* CLOSE ICON BACKGROUND IMAGE */
    .ui-icon,
    .ui-widget-content .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_ffffff_256x240.png);
    }
    .ui-widget-header .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_a8a3ae_256x240.png);
    }
    .ui-state-highlight .ui-icon,
    .ui-state-default .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_8d78a5_256x240.png);
    }
    .ui-state-hover .ui-icon,
    .ui-state-focus .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_734d99_256x240.png);
    }
    .ui-state-active .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_454545_256x240.png);
    }
    .ui-state-error .ui-icon,
    .ui-state-error-text .ui-icon {
        background-image: url(http://code.jquery.com/ui/1.10.4/themes/eggplant/images/ui-icons_ebccce_256x240.png);
    }
  • 0
    Я закончил тем, что создал свой собственный диалог, потому что маркетинг хотел что-то конкретное. Посетите team.eas.com и нажмите на видео. Спасибо за вашу помощь.
1

Вот ссылка на Theming the Dialog Box в пользовательском интерфейсе jQuery

-or больше specifically-

.ui-dialog {
    border:none;
}
.ui-dialog-titlebar-close {
    background-color:purple;
}

http://jsfiddle.net/AS4mu/

  • 0
    Спасибо за вашу помощь.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню