8 Star 98 Fork 18

myttyy / 基于layui的notice通知控件

Create your Gitee Account
Explore and code with more than 12 million developers,Free private repositories !:)
Sign up
Clone or Download
contribute
Sync branch
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README
MIT

基于layui的notice通知控件

项目介绍

更新日志
  • 2019-03-26
  • 重构V2版本,如需使用V1版请查看v1分支
  • 新增多种位置选择
  • 优化同时显示多条通知
  • css代码初始化js载入,不独立文件css文件。
更新日志
  • 2018年9月18日
  • 感谢layui社区成员@Thans修改了本插件
  • 优化显示位置,改到右侧。(@Thans)
  • 可以同时显示多条通知(@Thans)
  • css代码初始化载入,不独立文件。(@Thans)
  • 在Thans修改版本上增加桌面提醒

基于layui的notice通知控件,算是对layer的一个小扩展

列示:

使用说明

  1. 配置layui扩展
    layui.config({
        base: './../dist/'
    });
  1. 调用API
layui.use(['notice'], function () {
    var notice = layui.notice; // 允许别名 toastr
        
        // 初始化配置,同一样式只需要配置一次,非必须初始化,有默认配置
        notice.options = {
            closeButton:true,//显示关闭按钮
            debug:false,//启用debug
            positionClass:"toast-top-right",//弹出的位置,
            showDuration:"300",//显示的时间
            hideDuration:"1000",//消失的时间
            timeOut:"2000",//停留的时间
            extendedTimeOut:"1000",//控制时间
            showEasing:"swing",//显示时的动画缓冲方式
            hideEasing:"linear",//消失时的动画缓冲方式
            iconClass: 'toast-info', // 自定义图标,有内置,如不需要则传空 支持layui内置图标/自定义iconfont类名
            onclick: null, // 点击关闭回调
        };


        notice.warning("成功");
        notice.info("提示信息:毛都没有...");
        notice.error("大佬,我咋知道怎么肥四!");
        notice.success("大佬,我咋知道怎么肥四!");
       
        // 手动移除notice 或者使用 removeToast
        notice.hideToast()
        
});
  1. positionClass属性可选值:
  • toast-top-center
  • toast-bottom-center
  • toast-top-full-width
  • toast-bottom-full-width
  • toast-top-left
  • toast-top-right
  • toast-bottom-right
  • toast-bottom-left
  1. 其他配置项看源码吧,不是很难理解的

  2. 支持方法

layui.use(['notice'], function () {
    // 警告提示
    notice.warning("提示内容");
    // 正常提示
    notice.info("提示内容");
    // 异常提示
    notice.error("提示内容");
    // 
     notice.success("提示内容");
});

参与贡献

  1. Fork 本项目
  2. 新建 Feat_xxx 分支
  3. 提交代码
  4. 新建 Pull Request
The MIT License (MIT) Copyright (c) 2018 myttyy Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

About

基于layui的notice通知控件,算是对layer的一个小扩展 expand collapse
JavaScript
MIT
Cancel

Releases

No release

Contributors

All

Activities

Load More
can not load any more
JavaScript
1
https://gitee.com/myttyy/layuinotice.git
git@gitee.com:myttyy/layuinotice.git
myttyy
layuinotice
基于layui的notice通知控件
master

Search