Tooltip plugin toastr

  • There are many prompt box plug-ins, and the choices are different in different frameworks.

  • In the case, the prompt box uses the toastr plugin. (Hanging is the GitHub link, which may not be opened)

  • toastr documentation

  • To summarize its use steps are as follows:

Steps for usage:

  1. Load the toastr.css and toastr.js files

  2. Global configuration. For convenience, we write toastr.js as a global configuration for the following configuration, which is usually placed in the utils (global tools) folder. When using it, just load this configuration file.

     toastr.options = {
       // "closeButton": false,
       // "debug": false,
       // "newestOnTop": false,
       // "progressBar": false,
       "positionClass": "toast-center-center", // 提示框位置,这里填类名
       // "preventDuplicates": false,
       // "onclick": null,
       "showDuration": "300",              // 提示框渐显所用时间
       "hideDuration": "300",              // 提示框隐藏渐隐时间
       "timeOut": "2000",                  // 提示框持续时间
       // "extendedTimeOut": "1000",
       // "showEasing": "swing",
       // "hideEasing": "linear",
       // "showMethod": "fadeIn",
       // "hideMethod": "fadeOut"
     }
  3. call method, use directly

     toastr.info('提示信息');                // 普通提示
     toastr.success('提示信息');             // 成功提示
     toastr.warning('提示信息');             // 警告提示
     toastr.error('提示信息');               // 错误提示

Guess you like

Origin blog.csdn.net/m0_55960697/article/details/124269726