一款jQuery通知插件Noty

    一款jQuery通知插件Noty

    今天闲来无事,于是就给登录页面、注册页面、密码修改页面改了个版,在处理用户交互时,联想到了之前在bootstarp中看见的通知效果,于是就给整合进来了。Noty  GitHub地址

    首先将js与css加载到自己的主题中

    <!--jQuery文件-->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <!--noty主文件-->
    <script type="text/javascript" src="js/noty/jquery.noty.js"></script>
    <!--noty提示信息位置的文件, 需要哪些位置就引入对应的脚本,这里为center,可以添加多个布局文件-->
    <script type="text/javascript" src="js/noty/layouts/center.js"></script>
    <!--noty主题样式文件,-->
    <script type="text/javascript" src="js/noty/themes/default.js"></script>

    提示样式

    alert: 默认的提示样式
    success: 成功
    error: 错误
    warning: 警告
    information: 信息

    支持的布局位置:

    top: 顶部,长条状
    topLeft/topCenter/topRight: 顶部的左/中/右位置, 短条状
    center/centerLeft/centerRight: 正中/中左/中右, 短条状
    bottomLeft/bottomCenter/bottomRight: 底部左/中/右位置, 短条状
    bottom: 底部,长条状

    调用:

    new Noty({
        text: (data.message),
        type: 'warning',
        layout: 'topLeft',
        timeout: 5000
    }).show();

     

    noty有很多扩展选项,如果想使用此款插件的童鞋,可以自己去研究下。

    Responses

    您的电子邮箱地址不会被公开。 必填项已用*标注

    Up Next:

    Wordpress编辑器添加可视化按钮

    Wordpress编辑器添加可视化按钮