Question

我正在尝试调整PNotify通知的初始位置。正如您在图像中看到的那样，通知会阻止我的搜索栏。我想将通知的初始位置降低大约50px，这样就不会阻止搜索栏。

我一直在谷歌搜索这个问题很久了，但没有结果：

我试过了：

通过添加margin-top: 50px
在docs下有自定义类来更改初始位置，但它们都是自定义类，如stack_bar_top或stack_bar_bottom。我想自己调整这些值。
这个答案在Github页面上，但我被抛出了no such class as pnotify.css错误

这是我目前的PNotify代码：

    function notification(text, type) {
        new PNotify({
            text: text,
            type: type,
            animation: 'slide',
            delay: 3000,
            top:"500px",
            min_height: "16px",
            animate_speed: 400,
            text_escape: true,
            nonblock: {
                nonblock: true,
                nonblock_opacity: .1
            },
            buttons: {
                show_on_nonblock: true
            },
            before_open: function(PNotify){
                PNotify.css({
                    "top":"50px"
                });
            }
        });
    }

我检查了CSS，似乎ui-pnotify负责定位。默认值为top: 25px。

我在CSS中创建了一个新类并调用它：

.ui-pnotify {
  top: 50px;
}

Answer 1

下载pnotify的last version并使用下一个代码修改css文件中的选择器.ui-pnotify的样式（在我的情况下，我使用pnotify.custom.min.css）： p>

.ui-pnotify {
      top: 50px;/*Replace the 25px with the top that you need*/
      right:25px;
      position:absolute;
      height:auto;
      z-index:9999
    }

Answer 2

在您的配置中，设置firstpos1变量。

因此，当您定义堆栈时，它可能看起来像这样：

const defaultStack = {
    dir1: 'down',
    dir2: 'left',
    firstpos1: 50, // This is the initial position of the first popup relative to dir1
    firstpos2: 20,
    spacing1: 10,
    spacing2: 10,
    push: 'top',
    overlayClose: true,
    modal: false,
    context: document.body
};

来源：PNotify GitHub page

调整PNotify通知的初始位置

2 个答案: