All images minimized, restored on hover

Minimize the size of all images on a web page and restore them when the mouse hovers over them

目前為 2024-07-08 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         All images minimized, restored on hover
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Minimize the size of all images on a web page and restore them when the mouse hovers over them
// @author       Yearly
// @match        http://*/*
// @match        https://*/*
// @icon         data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3OC41ODIiIGhlaWdodD0iNzguNTgyIiB2aWV3Qm94PSIwIDAgNzguNTgyIDc4LjU4MiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTIzLjU4MiAyMy4wMDloNTV2NTVoLTU1eiIvPjxwYXRoIGQ9Ik00Ny40MTYgMTIuMzQxaC0zNnYzNmg4LjU1M1YyMC44NDJoMjcuNDQ3eiIvPjxwYXRoIGQ9Ik0zNiAuNTczSDB2MzZoOC41NTFWOS4wNzRIMzZ6Ii8+PC9zdmc+
// @license      AGPL-v3.0
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';

    let size = "200px";

    GM_addStyle(`
    img {
       transition: max-width 0.4s ease-in-out, max-height 0.4s ease-in-out;
       max-width : ${size};
       max-height : ${size};
       object-fit: contain;
    }
    img:hover{
       max-width : 100%;
       max-height : 100%;
    }
    `)

})();