☰

"Open Link in New Tab" Button

Adds an "Open link in new tab" button

  1. // ==UserScript==
  2. // @name         "Open Link in New Tab" Button
  3. // @namespace    openlinkinnewtab
  4. // @version      1.1.1
  5. // @description  Adds an "Open link in new tab" button
  6. // @author       Who cares
  7. // @license      GPLv3
  8. // @match        *://*/*
  9. // @exclude      *://tesla.com/*
  10. // @grant        none
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     function addOpenInNewTabButton(link) {
  17.         const button = document.createElement('button');
  18.         button.style.position = 'absolute';
  19.         button.style.display = 'inline-block';
  20.         button.style.zIndex = '9999';
  21.         button.style.padding = '3px';
  22.         button.style.background = 'white';
  23.         button.style.color = 'black';
  24.         button.style.border = '1px solid #555555';
  25.         button.style.borderRadius = '5px';
  26.         button.style.cursor = 'pointer';
  27.         button.style.margin = '5px';
  28.         button.style.opacity = '0';
  29.  
  30.         const icon1 = document.createElement('img');
  31.         icon1.src = 'https://i.ibb.co/b71mV9V/new-tab-dark.png';
  32.         icon1.style.width = '15px';
  33.  
  34.         const icon2 = document.createElement('img');
  35.         icon2.src = 'https://i.ibb.co/b71mV9V/new-tab-dark.png';
  36.         icon2.style.width = '20px';
  37.         icon2.style.display = 'none';
  38.  
  39.         button.appendChild(icon1);
  40.         button.appendChild(icon2);
  41.  
  42.         button.addEventListener('click', function(event) {
  43.             event.stopPropagation();
  44.             window.open(link.href, '_blank', 'noopener,noreferrer');
  45.         });
  46.  
  47.         button.addEventListener('mouseover', function() {
  48.             button.style.opacity = '1';
  49.             button.style.border = '1px solid #777777';
  50.             button.style.background = '#ffff00';
  51.             button.style.color = 'white';
  52.             icon1.style.display = 'none';
  53.             icon2.style.display = 'inline';
  54.         });
  55.  
  56.         button.addEventListener('mouseout', function() {
  57.             button.style.opacity = '0';
  58.             button.style.border = '1px solid #555555';
  59.             button.style.background = 'white';
  60.             button.style.color = 'black';
  61.             icon1.style.display = 'inline';
  62.             icon2.style.display = 'none';
  63.         });
  64.  
  65.         link.addEventListener('mouseover', function() {
  66.             button.style.opacity = '1';
  67.         });
  68.  
  69.         link.addEventListener('mouseout', function() {
  70.             button.style.opacity = '0';
  71.         });
  72.  
  73.         link.parentNode.appendChild(button);
  74.     }
  75.  
  76.     document.querySelectorAll('a').forEach(function(link) {
  77.         addOpenInNewTabButton(link);
  78.     });
  79. })();