如何在WordPress的网站实现（Noty）jquery通知

Question

我是jquery世界的新手。我不知道如何实现“Noty - 通知”插件在WordPress网站，如何创建通知和动画等。 文档不包括帮助文件

这些插件

的内容

• 布局[文件夹]（包括像bottom.js，bottomleft.js，top.js，topright.js等文件...

• 包装[文件夹]（包括两个文件jquery.noty.packaged.js & jquery.noty .packaged.min.js）

个

• 主题[FOLDER]（包括bootstrap.js，defalut.js & relax.js）

• jquery.noty.js [FILE]

• promise.js [FILE]

Answer 1

该文档不包含示例？ http://ned.im/noty/#/about再次检查它..它确实如此。

noty({text: 'magic'});

// never use eval unless you know what you do. just try this snippet to see some 
 
// examples in how you can use this. 
 
// for demonstration purposes i simply added the actual code to the buttons visible text. 
 
$("button").click(function(){eval($(this).text())})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-noty/2.3.7/packaged/jquery.noty.packaged.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css"> 
 
<button> 
 
    noty({text: "Hello World!"}); 
 
</button><br> 
 
<button> 
 
    noty({text: "message on top right", layout: "topRight"}); 
 
</button><br> 
 
<button> 
 
    noty({text: "message on bottom", layout: "bottom"}); 
 
</button><br> 
 
<button> 
 
    noty({text: "error!", type: "error", layout: "topRight"}); 
 
</button><br> 
 
<button> 
 
    noty({ 
 
     text: "this will disappear after 4 seconds", 
 
     type: "error", layout: "topRight", timeout: 4000, 
 
     animation: { 
 
      open: 'animated bounceInRight', // in order to use this you'll need animate.css 
 
      close: 'animated bounceOutRight', 
 
      easing: 'swing', 
 
      speed: 500 
 
     } 
 
    }); 
 
</button>

theese是默认选项：

$.noty.defaults = { 
    layout: 'top', 
    theme: 'defaultTheme', // or 'relax' 
    type: 'alert', 
    text: '', // can be html or string 
    dismissQueue: true, // If you want to use queue feature set this true 
    template: '<div class="noty_message"><span class="noty_text"></span><div class="noty_close"></div></div>', 
    animation: { 
     open: {height: 'toggle'}, // or Animate.css class names like: 'animated bounceInLeft' 
     close: {height: 'toggle'}, // or Animate.css class names like: 'animated bounceOutLeft' 
     easing: 'swing', 
     speed: 500 // opening & closing animation speed 
    }, 
    timeout: false, // delay for closing event. Set false for sticky notifications 
    force: false, // adds notification to the beginning of queue when set to true 
    modal: false, 
    maxVisible: 5, // you can set max visible notification for dismissQueue true option, 
    killer: false, // for close all notifications before show 
    closeWith: ['click'], // ['click', 'button', 'hover', 'backdrop'] // backdrop click will close all notifications 
    callback: { 
     onShow: function() {}, 
     afterShow: function() {}, 
     onClose: function() {}, 
     afterClose: function() {}, 
     onCloseClick: function() {}, 
    }, 
    buttons: false // an array of buttons 
};