zoukankan      html  css  js  c++  java
  • jquery 消息提醒插件 toastmessage

    最近做系统,想到使用后台要使用消息提醒,但是一直苦恼消息提醒的效果,于是找了一个toastmessage,还不错。记录下使用的方法。

    第一步:引入需要的文件

    <script type="text/javascript" src="/js/admin/toastmessage/jquery.toastmessage.js"></script>
        <link href="/js/admin/toastmessage/css/jquery.toastmessage.css" type="text/css" rel="stylesheet" />

    第二步:测试使用的函数

    <script>
        function showSuccessToast() {
            $().toastmessage('showSuccessToast', "Success Dialog which is fading away ...");
        }
        function showStickySuccessToast() {
            $().toastmessage('showToast', {
                text     : 'Success Dialog which is sticky',
                sticky   : true,
                position : 'top-right',
                type     : 'success',
                closeText: '',
                close    : function () {
                    console.log("toast is closed ...");
                }
            });
     
        }
        function showNoticeToast() {
            $().toastmessage('showNoticeToast', "Notice  Dialog which is fading away ...");
        }
        function showStickyNoticeToast() {
            $().toastmessage('showToast', {
                 text     : 'Notice Dialog which is sticky',
                 sticky   : true,
                 position : 'top-right',
                 type     : 'notice',
                 closeText: '',
                 close    : function () {console.log("toast is closed ...");}
            });
        }
        function showWarningToast() {
            $().toastmessage('showWarningToast', "Warning Dialog which is fading away ...");
        }
        function showStickyWarningToast() {
            $().toastmessage('showToast', {
                text     : 'Warning Dialog which is sticky',
                sticky   : true,
                position : 'top-right',
                type     : 'warning',
                closeText: '',
                close    : function () {
                    console.log("toast is closed ...");
                }
            });
        }
        function showErrorToast() {
            $().toastmessage('showErrorToast', "Error Dialog which is fading away ...");
        }
        function showStickyErrorToast() {
            $().toastmessage('showToast', {
                text     : 'Error Dialog which is sticky',
                sticky   : true,
                position : 'top-right',
                type     : 'error',
                closeText: '',
                close    : function () {
                    console.log("toast is closed ...");
                }
            });
        }
    </script>

    实例网站:

    http://akquinet.github.io/jquery-toastmessage-plugin/demo/demo.html

    This entry was posted in Javascript and tagged   

  • 相关阅读:
    零点存在定理与介值定理
    moco入门
    git的基础操作-入门
    有道笔记链接地址 -----关于python
    Linux学习---linux的svn的配置与安装
    Linux学习---linux系统下安装配置Jenkins
    Linux学习-linux系统下安装jdk和tomcat,以及遇到的问题清单
    Linux学习-linux系统下python升级到python3.6步骤详解,以及遇到的问题解决
    Linux学习---Linux目录结构说明
    电脑屏幕左上角出现一个小的白块
  • 原文地址:https://www.cnblogs.com/Gbeniot/p/5310047.html
Copyright © 2011-2022 走看看