☰

Mini_Toast

轻提示，友好提示

目前为 2024-03-25 提交的版本。查看 最新版本。

此脚本不应直接安装，它是一个供其他脚本使用的外部库。如果您需要使用该库，请在脚本元属性加入：// @require https://update.cn-greasyfork.org/scripts/490343/1348831/Mini_Toast.js 

  1. // ==UserScript==
  2. // @name         Mini_Toast
  3. // @version      1.0.4
  4. // @description  轻提示，友好提示
  5. // @author       Zosah
  6. // ==/UserScript==
  7.  
  8. const toastHandler = {
  9.     create: function () {
  10.         var style = document.createElement('style');
  11.         style.innerHTML = `
  12.         @keyframes show {
  13.             0% {
  14.                 opacity: 0;
  15.             }
  16.             100% {
  17.                 opacity: 1;
  18.             }
  19.         }
  20.         
  21.         @keyframes hide {
  22.             0% {
  23.                 opacity: 1;
  24.             }
  25.             100% {
  26.                 opacity: 0;
  27.             }
  28.         }
  29.         
  30.         .toast_box {
  31.             position: absolute;
  32.             bottom: 50%;
  33.             left: 50%;
  34.             z-index: 10;
  35.             transform: translate(-50%, -50%);
  36.             display: none;
  37.         }
  38.         
  39.         .toast_box p {
  40.             box-sizing: border-box;
  41.             padding: 10px 20px;
  42.             width: max-content;
  43.             background: #707070;
  44.             color: #fff;
  45.             font-size: 16px;
  46.             text-align: center;
  47.             border-radius: 6px;
  48.             opacity: 0.8;
  49.         }
  50.         
  51.         .toliet {
  52.             margin: 0 auto;
  53.         }`;
  54.  
  55.         // 将样式添加到 head 元素中
  56.         document.head.appendChild(style);
  57.  
  58.         // 创建提示框
  59.         var toastBox = document.createElement('div');
  60.         toastBox.className = 'toast_box';
  61.         toastBox.style.display = 'none';
  62.  
  63.         var toastText = document.createElement('p');
  64.         toastText.id = 'toast';
  65.         toastBox.appendChild(toastText);
  66.  
  67.         // 将提示框添加到 body 元素中
  68.         document.body.appendChild(toastBox);
  69.     },
  70.     showToast: function (text, time) {
  71.         var toast = document.getElementById('toast');
  72.         var toastBox = document.getElementsByClassName('toast_box')[0];
  73.         toast.innerHTML = text;
  74.         toastBox.style.animation = 'show 0.5s';
  75.         toastBox.style.display = 'inline-block';
  76.         setTimeout(function () {
  77.             toastBox.style.animation = 'hide 1s';
  78.             setTimeout(function () {
  79.                 toastBox.style.display = 'none';
  80.             }, 1400);
  81.         }, time);
  82.     }
  83. }