如何使用 Pines Notify jquery 插件？答案

【问题标题】：How to use Pines Notify jquery plugin?如何使用 Pines Notify jquery 插件？
【发布时间】：2010-11-12 14:15:47
【问题描述】：

我想使用 Pines Notify jQuery 插件在我的网站上显示通知但我不知道如何使用它。有人可以提供一些示例代码吗？

【问题讨论】：

你有什么问题？你面临什么问题？

标签： jquery-plugins

【解决方案1】：

这是我找到的唯一文档链接： http://sourceforge.net/apps/mediawiki/pines/index.php?title=Pines_Notify

【讨论】：

这是正确答案。列出带有描述的选项和选项的数据类型。
是的，这是可用的最好的文档，但仍然很少。事件处理程序和方法不存在:(

【解决方案2】：

这很容易找到。

去pines通知网站：http://pines.sourceforge.net/pnotify/
点击按钮，直到找到自己想要的效果。
在带有 Firebug 的 Chrome 或 Firefox 中，只需右键单击按钮即可获得所需的效果。你会看到一个输入标签，并且你想要 onclick="":


onclick="$.pnotify({
    pnotify_title: 'Regular Notice',
    pnotify_text: 'Check me out! I\'m a notice.'
});"

因此，如果您想在加载 jquery 后在 html 文档的末尾调用它，您只需执行以下操作：


// call your jquery and pines notify plugin scripts first

$.pnotify({
   pnotify_title: 'Whatever the Title Is',
   pnotify_text: 'This is the text of the notice!'
});

显然还有更多选项，您可以通过查看演示页面的源代码或查看 pines jquery 插件并找到它们定义选项的位置来找到它们。

【讨论】：

【解决方案3】：

看起来 Pines Notify 的文档相当缺乏。我的建议是查看demo website 的HTML 源代码。所有的 JavaScript 都在那个页面上（有大量的内联事件处理程序，yuck）。

【讨论】：

【解决方案4】：

确保在您的 HTML 中包含适当的文件。然后，这里是一些示例 javascript 代码。

function gaserror(){
var distance = Number(document.cars.distance.value);
switch( $('#listofcars :selected').text())
{
    case 'Volvo':
        if (distance>500)
            {
            $.pnotify({
                title: 'Error',
                text: 'You have run out of gas!',
                addclass: 'custom',
                type: 'error',
                opacity: 0.8,
                nonblock: true,
                nonblock_opacity: 0.2,
                sticker: false,
                stack: false,
                mouse_reset: false,
                history:false, //prevents the yellow error history tab from appearing after error triggered
                before_open: function(pnotify) {
                        pnotify.css({
                            "top": ($(window).height() / 2) - (pnotify.height() / 2),
                            "left": ($(window).width() / 2) - (pnotify.width() / 2)
                        });
                    }
                });
            }
        break;}}

【讨论】：