Window floating container

Adds a fixed header element for use by other scripts

当前为 2016-11-29 提交的版本,查看 最新版本

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

  1. // ==UserScript==
  2. // @name Window floating container
  3. // @version 1.1.3
  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. // @grant GM_getValue
  9. // @grant GM_setValue
  10. // ==/UserScript==
  11. /* jshint -W097 */
  12. /* global $ */
  13. /* jshint asi: true, multistr: true */
  14. 'use strict'
  15.  
  16.  
  17. var ijgFloater = $('#ijgWindowFloater')
  18. if (!ijgFloater.length) {
  19. GM_addStyle('#ijgWindowFloater {\
  20. position: absolute;\
  21. top: 100%;\
  22. left: 0;\
  23. z-index: 2000;\
  24. color: white;\
  25. background-color: #EB6841;\
  26. }\
  27. #ijgWindowFloater a {\
  28. color: white !important;\
  29. padding: 5px;\
  30. display: inline-block;\
  31. }\
  32. #ijgWindowFloater a:hover {\
  33. color: #FAF667 !important;\
  34. }\
  35. .ijgWindowFloater-item {\
  36. vertical-align: middle;\
  37. padding-left: 1em;\
  38. white-space: nowrap;\
  39. }\
  40. .ijg-is-closed .ijgWindowFloater-item {\
  41. display: none;\
  42. }\
  43. .ijgWindowFloater-toggle {\
  44. background-color: transparent;\
  45. box-shadow: inset 0 0 0 32px;\
  46. -webkit-transform-origin: right;\
  47. -ms-transform-origin: right;\
  48. transform-origin: right;\
  49. transform: rotate(180deg);\
  50. vertical-align: middle;\
  51. display: inline-block;\
  52. position: relative;\
  53. font-style: normal;\
  54. color: transparent;\
  55. text-align: left;\
  56. text-indent: -9999px;\
  57. direction: ltr;\
  58. box-sizing: border-box;\
  59. border: 2px solid white;\
  60. transition: all .2s;\
  61. border-radius: 50%;\
  62. width: 24px;\
  63. height: 24px;\
  64. margin: 2px 4px 4px 2px;\
  65. padding: 0;\
  66. top: 0;\
  67. left: -22px;\
  68. }\
  69. .ijgWindowFloater-toggle:before,\
  70. .ijgWindowFloater-toggle:after {\
  71. content: "";\
  72. width: 14px;\
  73. height: 2px;\
  74. position: absolute;\
  75. bottom: 0;\
  76. margin: auto 0;\
  77. box-shadow: inset 0 0 0 32px;\
  78. -webkit-transform-origin: right;\
  79. -ms-transform-origin: right;\
  80. transform-origin: right;\
  81. pointer-events: none;\
  82. width: 9px;\
  83. right: 6.5px;\
  84. color: white;\
  85. }\
  86. .ijgWindowFloater-toggle:before {\
  87. top: 2px;\
  88. -webkit-transform: rotate(45deg);\
  89. -ms-transform: rotate(45deg);\
  90. transform: rotate(45deg);\
  91. }\
  92. .ijgWindowFloater-toggle:after {\
  93. top: 0;\
  94. -webkit-transform: rotate(-45deg);\
  95. -ms-transform: rotate(-45deg);\
  96. transform: rotate(-45deg);\
  97. }\
  98. .ijg-is-closed .ijgWindowFloater-toggle:before {\
  99. top: 12px;\
  100. right: 8px;\
  101. }\
  102. .ijg-is-closed .ijgWindowFloater-toggle:after {\
  103. top: -10px;\
  104. right: 8px;\
  105. }')
  106. ijgFloater = $('<div id="ijgWindowFloater">')
  107. $('.nav-TopSpacer').append(ijgFloater).css('position', 'relative')
  108.  
  109. function getFloater() {
  110. return ijgFloater
  111. }
  112.  
  113. $('<i class="ijgWindowFloater-toggle">')
  114. .appendTo(ijgFloater)
  115. .on('click', function() {
  116. $('#ijgWindowFloater').toggleClass('ijg-is-closed')
  117. GM_setValue('ijgWindowFloater-closed', $('#ijgWindowFloater').hasClass('ijg-is-closed'))
  118. })
  119.  
  120. var isClosed = GM_getValue('ijgWindowFloater-closed')
  121. if (isClosed || typeof ijgWindowFloater-closed === 'undefined') {
  122. $('#ijgWindowFloater').addClass('ijg-is-closed')
  123. }
  124. }