☰

TPC Sticky User Toolbar

Transforms "User Options" on the left sidebar into a toolbar that sticks to the top

目前为 2021-08-02 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        TPC Sticky User Toolbar
  3. // @namespace   com.tipidpc.velc2009
  4. // @description Transforms "User Options" on the left sidebar into a toolbar that sticks to the top
  5. // @version     1.0.4
  6. // @match       https://tipidpc.com/*
  7. // @icon        https://www.google.com/s2/favicons?domain=tipidpc.com
  8. // @grant       GM_addStyle
  9. // ==/UserScript==
  10.  
  11. var userOptions = document.getElementById('user-options');
  12. if (!userOptions) return;
  13. userOptions.parentElement.removeChild(userOptions);
  14.  
  15. var userOptionsList = userOptions.getElementsByTagName('ul')[0];
  16.  
  17. userOptionsList.id = 'user-options-list';
  18. GM_addStyle('#user-options-list {background-color:#E80; padding:0.5em; top:0; box-sizing:border-box;}');
  19. GM_addStyle('#user-options-list {border-bottom:1px solid #333;}');
  20. GM_addStyle('#user-options-list li {background-image:none; display:inline; margin-bottom:0;}');
  21. GM_addStyle('#user-options-list li:last-of-type {float:right; margin-right:10px;}');
  22. GM_addStyle('#user-options-list li a {color: #fff;}');
  23.  
  24. var container = document.getElementById('container');
  25. var header = document.getElementById('header');
  26.  
  27. var anchor = document.createElement('div');
  28. header.appendChild(anchor);
  29. header.appendChild(userOptionsList);
  30.  
  31. var icon = (function() {
  32.   var icon = document.createElement('img');
  33.   icon.src = 'favicon.ico';
  34.   icon.style.verticalAlign = 'middle';
  35.  
  36.   var link = document.createElement('a');
  37.   link.href = '/index.php';
  38.   link.style.marginLeft = '10px';
  39.  
  40.   link.appendChild(icon);
  41.   return link;
  42. })();
  43.  
  44. function updateUserOptionsListPosition() {
  45.   var scrolledAmount = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
  46.   if (scrolledAmount > anchor.offsetTop) {
  47.     if (userOptionsList.style.position != 'fixed') {
  48.       userOptionsList.style.position = 'fixed';
  49.       anchor.style.height = userOptionsList.offsetHeight + 'px';
  50.       // userOptionsList.insertBefore(icon, userOptionsList.children[0]);
  51.     }
  52.   } else {
  53.     if (userOptionsList.style.position != 'static') {
  54.       userOptionsList.style.position = 'static';
  55.       anchor.style.height = '0';
  56.       // userOptionsList.removeChild(icon);
  57.     }
  58.   }
  59. }
  60.  
  61. function updateUserOptionsListWidth() {
  62. 	userOptionsList.style.width = container.offsetWidth + 'px';
  63. }
  64.  
  65. if (window.addEventListener) {
  66. 	window.addEventListener('scroll', updateUserOptionsListPosition);
  67. 	window.addEventListener('resize', updateUserOptionsListWidth);
  68. } else {
  69. 	window.attachEvent('onscroll', updateUserOptionsListPosition);
  70. 	window.attachEvent('onresize', updateUserOptionsListWidth);
  71. }
  72.  
  73. updateUserOptionsListPosition();
  74. updateUserOptionsListWidth();