1

我无法更改 jQuery UI 对话框标题栏的背景颜色。我是这样编码的：

jQuery("#divId").dialog({
            title: 'Information'
});
jQuery("#divId .ui-dialog-titlebar").css("background-color", "red");

顺便说一句，我的应用程序只能在 IE 中打开。我尝试使用 IE 开发人员工具检测标题栏和页脚 css 属性，但它不会检测到标题栏和页脚。但它识别 ui-dialog-content 的 css 属性。请给我建议。

4

2 回答 2

3

标题栏是 div 对话框的兄弟，因此请尝试：

jQuery("#dialog").prev('.ui-dialog-titlebar').css("background", "red");

仅指定背景颜色是不够的，您需要覆盖由以下规则放置在放置背景图像的标题 div 上的背景。

.ui-widget-header {
   border: 1px solid #aaaaaa/*{borderColorHeader}*/;
   background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/;
   color: #222222/*{fcHeader}*/;
   font-weight: bold;
}

但是使用 css 样式会更好。dialogClass为您要自定义的特定对话框指定 a 。

jQuery("#dialog").dialog({
    title: 'Information',
    dialogClass: 'info'
});

并为此提供规则并确保您的样式表在 jquery ui 之后加载。

.info .ui-widget-header {
    background:red;
}

小提琴

于 2013-09-13T03:12:28.173 回答
0

似乎删除课程比所有这些都好。

$("#dialog").dialog({
    dialogClass: 'custom-dialog',
    create: function () {
        $('.ui-dialog-titlebar').removeClass('ui-widget-header');
    }
});

和新的“.custom-dialog”类一样的风格

于 2014-11-18T14:06:06.473 回答