Обсуждения » Хотелки

Add button to page that opens the image displayed but with small URL modification.

Add button to page that opens the image displayed but with small URL modification.

  1. The button should appear on all pages with prefix "https://9gans.com/product/" (page example: https://9gans.com/product/9)
  2. Button placement doesn't matter as long as it's noticable
  3. Button should open the image in a new tab but replace "mini" with "originals" in the URL (URL example: https://storage.googleapis.com/9gans/mini/4.jpg?1591381411589 changes to: https://storage.googleapis.com/9gans/originals/4.jpg?1591381411589)

Note: regarding the URLs in item 3 above: By design, all images on this web site disappear after 60 minutes; so, depending on how quickly you read this forum post, the linked images may no longer exist.

that's easy to do

@hacker09 said: that's easy to do

Yeah, I suspected it wouldn't be hard to implement Unfortunately JS isn't part of my skill set so I don't know where to begin

// ==UserScript==
// @name Replace Mini Images On https://9gans.com/ With Originals To Make Images Bigger
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author hacker09
// @match https://storage.googleapis.com/9gans/mini/*
// @grant none
// ==/UserScript==

(function() {
'use strict';
document.location.replace(document.location.href.replace('mini', 'originals'));
})();

The codes below works only if you add them to the dev console and press enter
(function() {
'use strict';
//document.location.replace(document.location.href.replace('mini', 'originals'));
//The line below creates an "a" element so the buttons will appear
var copyButton = document.createElement("a");
var url = document.querySelector("#___gatsby > div > div > main > div > div > div.css-1j9i99f.e1sle6qy0 > div").children[0].childNodes[0].currentSrc;
//The lines below will detect the mouse click, copy/open and search for the anime title
copyButton.addEventListener("click",()=>{window.open(url, "_blank")});
//The lines below are the CSS for the copy button
copyButton.setAttribute("style", "margin-left: 13px;height: 10px;width: 10px;background-size: cover;display: inline-block;transform: scale(1.8);vertical-align: top;margin-top: 7px;");
//The lines below are the copy button image converted to DATA URI
copyButton.style.backgroundImage = "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFnSURBVGhD7ZlLSgNRFESzDp3qSPfjdlyOgjsTxM9U0HsggWt7k3716mln8A4chM61qjrT7CaTyeSsuQ6fwvfwq9Ml1U2LMlfhS1iFKS6pblqU4ZuvglSXVDctynyEVZDqkuqmRRk7QOQu/AyXvQdl7ACBtfEoYwc0Uo2vXkbGDmjg2Hie52coYwescGo85OcoYwecYG085M9Qxg44Qst4yJ+jjB1Q0Doe8g3K2AELlPGQ71DGDkio4yHfoowdsKdn/BByIfaw2XjIpaiy6XjIxaiw+XjI5djKqPH5/1GmJ2DkN58zUEYNGDkecg7KKAGjx0POQpnWgNtw9HjIeSijBNyHh7sR4yF3o4wawEuMGg9q/y96Am72f0fQ0/8DO8DE7rcDTOx+O8DE7rcDTOx+O8DE7rcDTOx+5zeB0b6FMo9hFbaFbJG5CJ/DKvA/ZQNburgMefvXsAr/S+l8CNkwmUwmZ8lu9w0a6EAybIGM4AAAAABJRU5ErkJggg==)";
//The lines below are the CSS for the copy button
document.querySelector("#___gatsby > div > div > main > div > div > div.css-1wakcbj.epdkhve2 > div.css-1dv8fo3.e1ruji7s0 > div").setAttribute("style", "display: inline-block;");

//The line below defines where the button should appear
document.querySelector("#___gatsby > div > div > main > div > div > div.css-1wakcbj.epdkhve2 > div.css-1dv8fo3.e1ruji7s0 > div").parentElement.appendChild(copyButton);
})();

§
Создано: 03.08.2020
Изменено: 03.08.2020

@Shawn Christy
Add these bookmarklet codes below as an favorite website on your browser,then click on this when you want to open the image.(search on google "add bookmarlet").

javascript:(function(){var url = document.querySelector("img.css-1573rvy.eh4dakc2").currentSrc;var urloriginals = url.replace("mini", "originals");window.open(urloriginals, '_blank')})()

Did you search on google "add bookmarklet"?

Ответить

Войдите, чтобы ответить.