"Open Link in New Tab" Button

Adds an "Open link in new tab" button

当前为 2023-11-20 提交的版本,查看 最新版本

// ==UserScript==
// @name         "Open Link in New Tab" Button
// @namespace    openlinkinnewtab
// @version      1.0
// @description  Adds an "Open link in new tab" button
// @author       Who cares
// @license      GPLv3
// @match        *://*/*
// @exclude      *://tesla.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function addOpenInNewTabButton(link) {
        const button = document.createElement('button');
        button.style.position = 'absolute';
        button.style.zIndex = '9999';
        button.style.padding = '1px';
        button.style.background = 'white';
        button.style.color = 'black';
        button.style.border = '1px solid #555555';
        button.style.borderRadius = '5px'; // Oval kenarlar
        button.style.cursor = 'pointer';
        button.style.margin = '5px'; // Buton ile bağlantı arasında "?" piksel aralık
        button.style.opacity = '0.7'; // Saydamlık 💀

        // İlk ikon
        const icon1 = document.createElement('img');
        icon1.src = 'https://i.ibb.co/b71mV9V/new-tab-dark.png'; // İkon URL
        icon1.style.width = '15px'; // İkonun genişliği

        // İkinci ikon (mouseover durumunda görünecek)
        const icon2 = document.createElement('img');
        icon2.src = 'https://i.ibb.co/b71mV9V/new-tab-dark.png'; // İkinci ikonun URL'si
        icon2.style.width = '20px'; // İkinci ikonun genişliği
        icon2.style.display = 'none'; // İkinci ikonu başlangıçta gizle

        button.appendChild(icon1);
        button.appendChild(icon2);

        button.addEventListener('click', function(event) {
            event.stopPropagation();
            window.open(link.href, '_blank');
        });

        // Bağlantının altına ekleniyor
        link.parentNode.appendChild(button);

        // Hover olayları
        button.addEventListener('mouseover', function() {
            button.style.border = '1px solid #777777'; // Mouse üzerine gelindiğinde kenarlık rengi
            button.style.background = '#ffff00'; // Mouse üzerine gelindiğinde buton rengi
            button.style.color = 'white';
            icon1.style.display = 'none'; // İlk ikonu gizle
            icon2.style.display = 'inline'; // İkinci ikonu göster
        });

        button.addEventListener('mouseout', function() {
            button.style.border = '1px solid #777777';
            button.style.background = 'white';
            button.style.color = 'black';
            icon1.style.display = 'inline'; // İlk ikonu göster
            icon2.style.display = 'none'; // İkinci ikonu gizle
        });
    }

    // Sayfa içindeki tüm bağlantıların yanında butonu tutar
    document.querySelectorAll('a').forEach(function(link) {
        addOpenInNewTabButton(link);
    });
})();