使用greasemonkey调整图像的div大小?

时间:2018-05-09 21:47:36

标签: javascript jquery html css

我使用SquareSpace来托管图片。在图像页面上,它会自动将图像放入图库中,但会将图像向上吹几千%。这意味着我必须滚动很大的长度才能找到我想看到的图像。

我想知道是否有人可以帮助我在每次访问页面时自动调整这些图像的大小,以便我可以轻松地右键单击并获取其链接。 div的一个例子:

<div class="slide sqs-gallery-design-autocolumns-slide" data-slide-id="x" data-slide-url="x" id="x" data-type="image" style="top: 16549px; left: 516px; width: 496px; height: 496px;">

我找到了this网站,可以帮助其他人帮助我。

谢谢。

1 个答案:

答案 0 :(得分:0)

您可以使用.cssjQuery执行此操作(请记住将其放在userscript函数中):

var size = "100px !important" //Your image size here.
$(".sqs-gallery-design-autocolumns-slide").css("width", size, "height", size);

这应该有效,假设您的图像将始终与您在OP中发布的同一个类。 如果没有,您始终可以找到图像的备用标识符。我确定页面上的其他图像将共享同一个类,因此它会调整大量的图像,因此您可以相应地调整类或使用ID / Value之类的内容。

您的相关网页令我感到困惑,所以我只是愚蠢地调整所有图片的大小,记得阅读有关用户脚本如何工作的信息,并将@match标题设置为特定的要执行的页面。

var style = document.createElement("style");
style.innerHTML = "img{width:50%;}";

编辑:为24小时等待道歉,再次获得一些空闲时间。显然,TamperMonkey不会自动包含jQuery,因此除非有问题的页面正在运行库,否则它将无法执行。

这是一个非常简单的纯JS解决方案:

// ==UserScript==
// @name         Resize Div
// @namespace    https://stackoverflow.com/users/9767541/cillian-collins
// @version      0.1
// @description  try to take over the world!
// @match        * //Put your URL here so that the script doesn't execute on every page you visit!
// @author       Cillian Collins
// @grant        none
// ==/UserScript==

(function() {
'use strict';

// Your code here...
document.getElementByClass("slide").style.width = "100px !important"; //Width
document.getElementByClass("slide").style.height = "100px !important"; //Height
})();