☰

Window floating container

Adds a fixed header element for use by other scripts

当前为 2016-11-28 提交的版本，查看 最新版本。

此脚本不应直接安装。它是供其他脚本使用的外部库，要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/18233/160309/Window%20floating%20container.js 

  1. // ==UserScript==
  2. // @name         Window floating container 
  3. // @version      1.0.0
  4. // @description  Adds a fixed header element for use by other scripts
  5. // @author       @_jnblog
  6. // @require      https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js
  7. // @grant        GM_addStyle
  8. // ==/UserScript==
  9. /* jshint -W097 */
  10. /* global $ */
  11. /* jshint asi: true, multistr: true */
  12. 'use strict'
  13.  
  14. var ijgFloater = $('#ijgWindowFloater')
  15. if (!ijgFloater.length) {
  16.   GM_addStyle('#ijgWindowFloater {\
  17.     position: fixed;\
  18.     top: 0;\
  19.     left: 0;\
  20.     z-index: 2000;\
  21.     color: white;\
  22.     background-color: #EB6841;\
  23.   }\
  24.   #ijgWindowFloater a {\
  25.     color: white !important;\
  26.     padding: 5px;\
  27.     display: inline-block;\
  28.   }\
  29.   #ijgWindowFloater a:hover {\
  30.     color: #FAF667 !important;\
  31.   }\
  32.   .ijgWindowFloater-item + .ijgWindowFloater-item {\
  33.     padding-left: 1em;\
  34.   }\
  35.   .ijgWindowFloater-toggle {\
  36.     padding: 0;\
  37.     top: -1px;\
  38.     left: -22px;\
  39.     box-shadow: inset 0 0 0 32px;\
  40.     -webkit-transform-origin: right;\
  41.     -ms-transform-origin: right;\
  42.     transform-origin: right;\
  43.     transform: rotate(180deg);\
  44.     display: inline-block;\
  45.     vertical-align: middle;\
  46.     position: relative;\
  47.     font-style: normal;\
  48.     color: transparent;\
  49.     text-align: left;\
  50.     text-indent: -9999px;\
  51.     direction: ltr;\
  52.     box-sizing: border-box;\
  53.     border: 2px solid white;\
  54.     transition: all .2s;\
  55.     border-radius: 50%;\
  56.     width: 24px;\
  57.     height: 24px;\
  58.     margin: 2px;\
  59.     background-color: transparent;\
  60.   }\
  61.   .ijgWindowFloater-toggle:before {\
  62.     content: "";\
  63.     width: 14px;\
  64.     height: 2px;\
  65.     position: absolute;\
  66.     bottom: 0;\
  67.     margin: auto 0;\
  68.     right: 2px;\
  69.     box-shadow: inset 0 0 0 32px;\
  70.     -webkit-transform-origin: right;\
  71.     -ms-transform-origin: right;\
  72.     transform-origin: right;\
  73.     top: 2px;\
  74.     -webkit-transform: rotate(45deg);\
  75.     -ms-transform: rotate(45deg);\
  76.     transform: rotate(45deg);\
  77.     width: 11px;\
  78.     right: 8px;\
  79.     color: white;\
  80.   }\
  81.   .ijgWindowFloater-toggle:after {\
  82.     height: 2px;\
  83.     position: absolute;\
  84.     bottom: 0;\
  85.     margin: auto 0;\
  86.     box-shadow: inset 0 0 0 32px;\
  87.     -webkit-transform-origin: right;\
  88.     -ms-transform-origin: right;\
  89.     transform-origin: right;\
  90.     content: "";\
  91.     top: 0;\
  92.     -webkit-transform: rotate(-45deg);\
  93.     -ms-transform: rotate(-45deg);\
  94.     transform: rotate(-45deg);\
  95.     pointer-events: none;\
  96.     width: 11px;\
  97.     right: 8px;\
  98.     color: white;\
  99.   }')
  100.   
  101.   ijgFloater = $('<div id="ijgWindowFloater"><i class="ijgWindowFloater-toggle"></i></div>')
  102.   $('body').prepend(ijgFloater)
  103. }
  104.  
  105. function getFloater() {
  106.   return ijgFloater
  107. }