Question

使用Pnotify插件 http://sciactive.com/pnotify/

我试图将它重新定位到屏幕的左下角，让它向上推动连续的菜单..

定位不是问题，但通知的方向全部堆叠在一起（我只看到最新的通知，其余的都在它后面）

代码应该是直截了当的，

 var stack_bottomleft = {"dir1": "up", "dir2": "up", "push": "top"};

            new PNotify({
                title: "Title",
                type: "Success",
                text: "My Message 1",
                animation: "fade",
                animate_speed: 'fast',

                addclass: "stack-bottomleft",
                stack:    stack_bottomleft

            });

            new PNotify({
                title: "Title",
                type: "Success",
                text: "My Message 2",
                animation: "fade",
                animate_speed: 'fast',

                addclass: "stack-bottomleft",
                stack:    stack_bottomleft

            });


            new PNotify({
                title: "Title",
                type: "Success",
                text: "My Message 3",
                animation: "fade",
                animate_speed: 'fast',

                addclass: "stack-bottomleft",
                stack:    stack_bottomleft

            });

也许是一个错误？

Answer 1

您必须注意创建堆栈的位置。例如，不要在if语句中创建它，因为它将为每个通知创建一个新堆栈，并且堆栈将重叠。我在pnotify主页上发现了这个对index.html的评论：

  /*********** Custom Stacks ***********
    * A stack is an object which PNotify uses to determine where
    * to position notices. A stack has two mandatory variables, dir1
    * and dir2. dir1 is the first direction in which the notices are
    * stacked. When the notices run out of room in the window, they
    * will move over in the direction specified by dir2. The directions
    * can be "up", "down", "right", or "left". Stacks are independent
    * of each other, so a stack doesn't know and doesn't care if it
    * overlaps (and blocks) another stack. The default stack, which can
    * be changed like any other default, goes down, then left. Stack
    * objects are used and manipulated by PNotify, and therefore,
    * should be a variable when passed. So, calling something like
    *
    * new PNotify({stack: {"dir1": "down", "dir2": "left"}});
    *
    * will **NOT** work. It will create a notice, but that notice will
    * be in its own stack and may overlap other notices.
    */

我遇到了同样的问题：

            $rootScope.$watch('feedback',function(){
                if($rootScope.feedback){
                 var stack_bottomleft = {"dir1": "up", "dir2": "right", "firstpos1": 25, "firstpos2": 25};
                    new PNotify({
                        title: $rootScope.feedback.title,
                        text: $rootScope.feedback.text,
                        type: $rootScope.feedback.type,
                        addclass: 'stack-bottomleft',
                        stack: stack_bottomleft
                    });
                    $rootScope.feedback=null;
                }
            });

并修复：

var stack_bottomleft = {"dir1": "up", "dir2": "right", "firstpos1": 25, "firstpos2": 25};
            $rootScope.$watch('feedback',function(){
                if($rootScope.feedback){
                    new PNotify({
                        title: $rootScope.feedback.title,
                        text: $rootScope.feedback.text,
                        type: $rootScope.feedback.type,
                        addclass: 'stack-bottomleft',
                        stack: stack_bottomleft
                    });
                    $rootScope.feedback=null;
                }
            });

我希望这会对你有所帮助！

Answer 2

mentioned与@Tristan Reifert类似，在通知init中设置堆栈对象与传输该堆栈对象以注意init参数之间存在关键差异。

因此，即使下一个代码也不起作用：

var showNotice = function () {
    var stack = {dir1: "up", dir2: "left", firstpos1: 25, firstpos2: 25},

    return new PNotify({
        title: 'Some title', text: 'Some text',
        addclass: "stack-bottomright",
        stack: stack
    });
}

这里的要点是同一堆栈通知应该接收为其配置的同一个堆栈对象。在上面显示的情况下，新对象将在每个函数调用时初始化，每个通知将接收不同的对象。

为避免这种情况，所有通知都应该针对同一个对象。例如：

    var stack = {dir1: "up", dir2: "left", firstpos1: 25, firstpos2: 25},
        showNotice = function () {     
            return new PNotify({
                title: 'Some title', text: 'Some text',
                addclass: "stack-bottomright",
                stack: stack
            });
        }

这样做，showNotice()的每次后续调用都将解决之前通知所解决的相同堆栈对象。

Jquery PNotify = bottomleft配置不能正常工作

2 个答案: