☰

Unfix

Stop fixed/sticky elements leeching my valuable screen real estate!

  1. // ==UserScript==
  2. // @name	Unfix
  3. // @description	Stop fixed/sticky elements leeching my valuable screen real estate!
  4. // @author	Remph
  5. // @license	GPL-3.0-or-later
  6. // @version	0.2.5
  7. // @include	*
  8. // @namespace	https://git.sr.ht/~remph/unfix.js
  9. // @homepageURL	https://git.sr.ht/~remph/unfix.js
  10. // @supportURL	https://git.sr.ht/~remph/unfix.js
  11. // @grant	none
  12. // @compatible	firefox
  13. // ==/UserScript==
  14.  
  15. 'use strict';
  16.  
  17. function unfix_element(e) {
  18. 	var newpos;
  19. 	switch (getComputedStyle(e).position) {
  20. 	case 'fixed':
  21. 		newpos = 'absolute';
  22. 		break;
  23. 	case 'sticky':
  24. 		newpos = 'relative';
  25. 	}
  26. 	if (newpos) {
  27. //		console.debug('setting ' + e.tagName + ' to ' + newpos);
  28. 		e.style.setProperty('position', newpos, 'important');
  29. 		/* I would rather not have abused !important ^ here, to let
  30. 		   pages specify when the position really *is* important
  31. 		   and shouldn't be elided, but no-one can be responsible
  32. 		   with it so I will take it away */
  33. 	}
  34. }
  35.  
  36. function unfix_tree(root) {
  37. 	if (root.nodeType !== Node.ELEMENT_NODE)
  38. 		return;
  39. 	unfix_element(root);
  40. 	// NodeFilter.SHOW_ATTRIBUTE ?
  41. 	var t = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT);
  42. 	while (t.nextNode())
  43. 		unfix_element(t.currentNode);
  44. }
  45.  
  46. (function () {
  47. 	// wait for window to finish loading to prevent races on style
  48. 	window.addEventListener('load', () => unfix_tree(document.body));
  49.  
  50. 	// Catch sneaky attempts to re-fix an element from js
  51. 	new MutationObserver((muts) => muts.forEach(function (mut) {
  52. 		/* Are these sure to be mutually exclusive? Can an
  53. 		   attributes change also have addedNodes? */
  54. 		switch (mut.type) {
  55. 		case 'attributes':
  56. 			unfix_element(mut.target); // if (mut.attributeName == 'style') ?
  57. 			break;
  58. 		case 'childList':
  59. 			mut.addedNodes.forEach(unfix_tree);
  60. 		}
  61. 	})).observe(document.body, {
  62. 		subtree: true, childList: true, attributes: true
  63. 	});
  64. })();