☰

<iframe> click to load

NOT lazyload; click a button instead anywhere in the whole <iframe> element so one won't mis-click; will ignore small / narrow <iframe>s.

目前為 2020-10-05 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name        <iframe> click to load
  3. // @name:zh-CN 手动加载 <iframe>
  4. // @description NOT lazyload; click a button instead anywhere in the whole <iframe> element so one won't mis-click; will ignore small / narrow <iframe>s.
  5. // @description:zh-CN 不是 lazyload；点击按钮而不是点击 <iframe> 元素，以免误触；会忽略大小较小的 <iframe> 元素。
  6. // @namespace   RainSlide
  7. // @author      RainSlide
  8. // @version     1.0
  9. // @match       *://*/*
  10. // @grant       none
  11. // @inject-into context
  12. // @run-at      document-end
  13. // ==/UserScript==
  14.  
  15. document.querySelectorAll('iframe').forEach(
  16. 	iframe =>
  17.  
  18. 		// attribute
  19. 		iframe.getAttribute("src")    !== null &&
  20. 		iframe.getAttribute("srcdoc") === null &&
  21.  
  22. 		// content size
  23. 		iframe.clientWidth  >= 72 &&
  24. 		iframe.clientHeight >= 72 &&
  25. 		( iframe.clientWidth + iframe.clientHeight ) >= 256 &&
  26.  
  27. 		iframe.setAttribute("srcdoc",
  28.  
  29. `<style>
  30. html, body { height: 100%; }
  31. body {
  32. 	display: flex;
  33. 	flex-direction: column;
  34. 	justify-content: center;
  35. 	align-items: center;
  36. 	box-sizing: border-box;
  37. 	min-width: 5em;
  38. 	margin: 0;
  39. 	padding: .5em;
  40. 	border: 2px dashed currentColor;
  41. }
  42. a {
  43. 	margin-bottom: 1ex;
  44. 	word-break: break-all;
  45. 	font-family: monospace;
  46. }
  47. </style>
  48. <a href="${ iframe.src }" target="_blank" rel="noreferrer noopener">${ iframe.src }</a>
  49. <button onclick="window.frameElement.removeAttribute('srcdoc')">${
  50. 	new Map([
  51. 		["en-US", "Load"],
  52. 		["zh-CN", "加载"],
  53. 		["zh-TW", "加載"],
  54. 		["zh-HK", "加載"],
  55. 	]).get( navigator.language ) || "Load"
  56. }</button>`
  57.  
  58. 		)
  59.  
  60. );