Greasemonkey or Stylish for Changing Picture on Website Locally

[Thermite]

Everyone know what greasemonkey and stylish are for firefox right. If not go look it up now because they are amazing add ons. I want to know how you would go about replacing one picture on a website with another permanently using an add-on like Greasemonkey or Stylish. I don't know how to write any code for these add ons. Anyone have any suggestions on how I could do this. 

[Dr3nz4r]

I'd suggest Greasemonkey...
I could give you a script I do use on a different site, to change thier Logo with a one I made, hence theirs looks so god damn shitty

// ==UserScript==// @name       LogoChanger v1.0.5// @namespace   http://linustechtips.com/main/user/576-dr3nz4r/// @author      Julain aka Fresh aka Dr3nz4r// @description replaces the any logo with one of your wish// @include     http://linustechtips.com/*// @include     *.linustechtips.com/*// @version     1.0.5// @grant       none// ==/UserScript==// saves all settings of all <img> tags in the tags variable/arrayvar tags = document.getElementsByTagName('img');// goes through every entry in the tags array, so through every <img> tagfor (var i = 0; i < tags.length; i++) { // replaces the searched image src with the one you want. This happens in ALL <img> tags with the searched src  tags[i].src = tags[i].src.replace('https://linustechtips.com/main/public/style_images/1_Linus-Tech-Tips-Equal-2.png', 'http://puu.sh/5m5vU.png');}

For use, replace the two @include URLS like they are in the example script which replaces the LTT Logo, then change the image url's in the second last code line like this:

src.replace('https://linustechtips.com/main/public/style_images/1_Linus-Tech-Tips-Equal-2.png', 'http://puu.sh/5m5vU.png');

replace the first URL with the content of the img src (e.g

<img src="xxx" alt="yyy" />

) and the second one with your image src (e.g http://puu.sh/5m5vU.png)

so it looks like this:

src.replace('xxx', 'http://puu.sh/5m5vU.png');

The images src can be found via the sourcecode, the most easiest way is with FireBug or the Webkit development tools of your Browser.

Thats what the whole tag should look like (bottom, blue marked):
 


the Logo of this forum looks like this after applying the script:

[SUICIDAL]

I had some fun with this today

[IdeaStormer]

So what would I need to change all jpg's to a set jpg? Still new to the grease   reading up though.

[IdeaStormer]

Found it

 

 

// ==UserScript==// @[member='Name Change'] All Images// @namespace Aaron Russell// @include *// @[member=Grant]       none// ==/UserScript==var pic = "http://www.makeuseof.com/wp-content/uploads/2008/12/greasemonkeylogo.gif";var a = "-1";while (a<document.images.length) {a++;document.images[a].src=pic;}

I dare you to try it Edited February 20, 2014 by IdeaStormer