通知错误颜色通知

Question

你好，我试图改变每个通知的颜色，但我找不到从哪里。我用jqueryui做造型。贝娄，你可以看到错误和成功通知如何出现在我的屏幕上！

​

​

​

​

这是我正在使用的代码，用于动态构建调用pnotify的脚本。

string script1 = @"var displayIcon = " + displayIcon + @";
                            $(function(){
                                new PNotify({
                                    title: '" + messageString + @"',
                                    styling: 'jqueryui',
                                    width: '400px',
                                    opacity: 0.9,
                                    type: '" + typeLowercase + @"',
                                    icon: displayIcon,
                                    hide: false,
                                    buttons: {
                                        sticker: false
                                    },
                                    animation: {
                                        effect_in: 'fade',
                                        effect_out: 'slide'
                                    }
                                });
                            });";

Answer 1

初始化background-colour时没有PNotify选项。对于任何自定义样式，都需要使用addclass选项。ui.pnotify .ui-pnotify-container定义通知的背景色。在ui.pnotify的末尾附加一个额外的类(例如，ui.pnotify.myclass)，并为它分配一个background-color，将允许您在初始化阶段使用myclass。

因此，如果要将通知指定为红色的背景颜色，则创建如下所示的css规则：

.ui-pnotify.red .ui-pnotify-container {
  background-color: red !important;
}

然后，在初始化阶段，您可以使用addclass选项如下：

$(function() {
  new PNotify({
    title: '" + messageString + @"',
    styling: 'jqueryui',
    width: '400px',
    opacity: 0.9,
    type: '" + typeLowercase + @"',
    icon: displayIcon,
    hide: false,
    addclass: 'red',
    buttons: {
      sticker: false
    },
    animation: {
      effect_in: 'fade',
      effect_out: 'slide'
    }
  });
});

当您在addclass选项中指定自定义类名时，您不需要包含ui-pnotify；只需要包含后面类的名称(在本例中是red)。

在下面的小提琴中，我创建了两个自定义类(red和blue)。将addclass的值更改为red或blue，以查看自定义的背景颜色：

小提琴演示