☰

rant-image-viewer

Devrant image viewer

当前为 2017-07-11 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         rant-image-viewer
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1
  5. // @description  Devrant image viewer
  6. // @author       Himalay
  7. // @match        https://www.devrant.io/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.   "use strict";
  13.   document.querySelector("style").innerHTML += `.rant-lightbox {
  14.         position: fixed;
  15.         top: 0;
  16.         left: 0;
  17.         width: 100%;
  18.         height: 100%;
  19.         background: rgba(0, 0, 0, 0.8);
  20.         display: flex;
  21.         align-items: center;
  22.         justify-content: center;
  23.         flex-direction: column;
  24.         z-index: 9999;
  25.         padding: 10px;
  26.     }
  27.     .rant-lightbox img {
  28.         max-height: 90vh;
  29.     }
  30.     .rant-lightbox a {
  31.         margin-top: 10px;
  32.         font-size: 1.5em;
  33.     }`;
  34.   document.addEventListener("click", e => {
  35.     if (e.target.parentElement.classList.contains("rant-image")) {
  36.       document.body.innerHTML += `<div class="rant-lightbox" onclick="this.parentElement.removeChild(this);"><img src="${e
  37.         .target.src}" /><a href="${e.target
  38.         .src}" download="${e.target.src.split("/").pop()}">?</a></div>`;
  39.       e.preventDefault();
  40.       e.stopPropagation();
  41.     }
  42.   });
  43. })();