Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Expand All Images in 4chan Thread Greasemonkey Extension
// ==UserScript==
// @name Expand All Images
// @namespace zombiearmy.expandimage
// @description Expand all images in a 4chan thread
// @include https://boards.4chan.org/*
// @version 1
// @grant none
// ==/UserScript==
var expanded = false;
//add expand buttons for desktop
var navlink = document.getElementsByClassName("navLinks desktop");
for(var i = 0; i < navlink.length; i++) {
navlink[i].innerHTML += " [<a href='javascript:toggleImages()'>Toggle Images</a>] ";
}
//add expand buttons for mobile
navlink = document.getElementsByClassName("navLinks mobile");
for(var i = 0; i < navlink.length; i++) {
navlink[i].innerHTML += '<span class="mobileib button"><a href="javascript:toggleImages()">Expand Images</a></span>';
}
window.toggleImages = function() {
var thumbs = document.getElementsByClassName("fileThumb");
if(!expanded) {
for(var i = 0; i < thumbs.length; i++) {
ImageExpansion.expand(thumbs[i].getElementsByTagName('img')[0]);
}
expanded = true;
}else{
for(var i = 0; i < thumbs.length; i++) {
ImageExpansion.contract(thumbs[i].getElementsByTagName('img')[1]);
}
expanded = false;
}
}
@tipplerdev

This comment has been minimized.

Show comment
Hide comment
@tipplerdev

tipplerdev May 18, 2017

If anyone is confused on how To use this code, right click the page -> inspect element -> console -> paste this code in

Then go to the bottom of the 4chan thread and click "Toggle Images"

Done!

perfect way to enlarge all images in a 4chan thread to easily download them in full resolution. +1 !!!

tipplerdev commented May 18, 2017

If anyone is confused on how To use this code, right click the page -> inspect element -> console -> paste this code in

Then go to the bottom of the 4chan thread and click "Toggle Images"

Done!

perfect way to enlarge all images in a 4chan thread to easily download them in full resolution. +1 !!!

@3ICE

This comment has been minimized.

Show comment
Hide comment
@3ICE

3ICE Jun 11, 2017

Thanks! Here is the above code in bookmarklet form:

var t=document.getElementsByClassName("fileThumb");
for(var i=0;i<t.length;i++){ImageExpansion.expand(t[i].getElementsByTagName('img')[0]);}

(without the fancy button and toggle behavior)

3ICE commented Jun 11, 2017

Thanks! Here is the above code in bookmarklet form:

var t=document.getElementsByClassName("fileThumb");
for(var i=0;i<t.length;i++){ImageExpansion.expand(t[i].getElementsByTagName('img')[0]);}

(without the fancy button and toggle behavior)

@3ICE

This comment has been minimized.

Show comment
Hide comment
@3ICE

3ICE Jun 11, 2017

True bookmarklet with the (function(){...})(); IIFE wrapper:
javascript:(function(){var t=document.getElementsByClassName("fileThumb");for(var i=0;i<t.length;i++){ImageExpansion.expand(t[i].getElementsByTagName('img')[0]);}})();

3ICE commented Jun 11, 2017

True bookmarklet with the (function(){...})(); IIFE wrapper:
javascript:(function(){var t=document.getElementsByClassName("fileThumb");for(var i=0;i<t.length;i++){ImageExpansion.expand(t[i].getElementsByTagName('img')[0]);}})();

@eithompson

This comment has been minimized.

Show comment
Hide comment
@eithompson

eithompson Feb 16, 2018

The links are showing on the page, but when I click them in Firefox 58.0.22 nothing happens. The console says ReferenceError: toggleImages is not defined. I've tried messing around but can't find a solution. Any help would be appreciated.

The links are showing on the page, but when I click them in Firefox 58.0.22 nothing happens. The console says ReferenceError: toggleImages is not defined. I've tried messing around but can't find a solution. Any help would be appreciated.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment