☰

kumomine toast

Show toast

This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greatest.deepsurf.us/scripts/6077/22889/kumomine%20toast.js 

  1. // ==UserScript==
  2. // @name           kumomine toast
  3. // @version     0.1
  4. // @require	   http://code.jquery.com/jquery-2.1.1.min.js
  5. // @description    Show toast
  6. // ==/UserScript==
  7.  
  8. function warn(msg, opt, left, top) {
  9.   if (opt) {
  10.     var obj = $('#' + opt);
  11.   }
  12.   new Toast({
  13.     context: $('body'),
  14.     message: msg
  15.   }, obj, left, top).show();
  16. }
  17. var Toast = function (config, obj, left, top) {
  18.   this.context = config.context == null ? $('body')  : config.context; //上下文
  19.   this.message = config.message; //显示内容
  20.   this.time = config.time == null ? 5000 : config.time; //持续时间
  21.   this.left = config.left; //距容器左边的距离
  22.   this.top = $('window').scrollTop()+80; //($(document).height() / 4) * 3; //距容器上方的距离
  23.   if (obj) {
  24.     this.left = obj.offset().left + left;
  25.     this.top = obj.offset().top + top;
  26.   }
  27.   this.init();
  28. }
  29. var msgEntity;
  30. Toast.prototype = {
  31.   //初始化显示的位置内容等
  32.   init: function () {
  33.     $('#toastMessage').remove();
  34.     //设置消息体
  35.     var msgDIV = new Array();
  36.     msgDIV.push('<div id="toastMessage">');
  37.     msgDIV.push('<span>' + this.message + '</span>');
  38.     msgDIV.push('</div>');
  39.     msgEntity = $(msgDIV.join('')).appendTo(this.context);
  40.     //设置消息样式
  41.     var left = this.left == null ? this.context.width() / 2 - msgEntity.find('span').width() / 2 : this.left;
  42.     var top = $(document).scrollTop() + 20;
  43.     msgEntity.css({
  44.       position: 'absolute',
  45.       top: top,
  46.       'z-index': '99',
  47.       left: left,
  48.       color: 'black',
  49.       'font-size': '12px',
  50.       padding: '5px',
  51.       margin: '5px',
  52.       'border-radius': '4px',
  53.       '-moz-border-radius': '4px',
  54.       '-webkit-border-radius': '4px',
  55.       opacity: '0.8',
  56.       'font-family': '微软雅黑',
  57.       'background-color': '#F9EDBE',
  58.       'border': '1px solid #FBDA91',
  59.       'box-shadow': '1px 2px 5px rgba(0, 0, 0, 0.5)'
  60.     });
  61.     //msgEntity.addClass(".toast");
  62.     msgEntity.hide();
  63.   },
  64.   //显示动画
  65.   show: function () {
  66.     msgEntity.fadeIn(500);
  67.     msgEntity.fadeOut(this.time);
  68.   }
  69. };