当前位置:主页 > JavsScript库 > 通知 / 提示 >

javascript中简单灵活的Toast通知插件 - toastmejs
栏目分类:通知 / 提示   发布日期:2021-08-18   浏览次数:

toastmejs 是一个轻量级、简单、灵活、可定制的原生 JavaScript 的 toast 通知库。

特征:

  • 简单明快的主题。

  • 自定义图标。

  • 位置变量。

  • 自定义超时。

  • 成功/错误/警告/信息类型。

如何使用它:

安装和导入。

# NPM
$ npm install toastjs --save
import toastme from 'toastjs'

或者直接在文档中加载以下JS&CSS文件。

<link rel="stylesheet" href="./dist/css/toastme.css"/>
<script src="./dist/js/toastme.js" ></script>

创建一个新的 toastme 实例。

const myToast = new Toastme();

创建 Toast 通知。

myToast.default("这是一个 'default' 通知")
myToast.success("这是一个 'success' 通知")
myToast.error("这是一个 'error' 通知")
myToast.warning("这是一个 'warning' 通知")
myToast.info("这是一个 'info' 通知")

通过覆盖默认参数来配置 toast 通知,如下所示:

const myToast = new Toastme({
      timeout: 5000,
      distanceX: 15,
      distanceY: 15,
      positionY: "bottom", // or 'top'
      positionX:" right", // or 'left', 'center'
      zIndex: 100,
      ligh: false // light theme?
});



官方网站:https://github.com/AlexSegen/toastmejs

相关热词: 通知Toasttoastmejs

相关下载
声源:本站内容均来自互联网,仅供交流学习之用,请勿作商业用途,所有资源版权归原作者所有。如果有侵犯到您的权益,请联系本站删除,谢谢合作!
jQuery库 JavsScript库 Html5库 CSS3库