The following is an archive of comments made before threaded discussions was implemented (November 16th, 2008)

Neat script. HOWEVER, when an ad uses postlets, it returns terrible results.

Check out http://washingtondc.craigslist.org/rea/ for confirmation when you have this script installed.

Since Jeffrey doesn't seem to be updating his wonderful script, I posted my bug fixes & improvements, plus the Canadian fix (thanks Rich!) as a new script, "Craigslist image preview 2". It now filters out tiny images, and enlarges the thumbnails on mouseover.

http://userscripts.org/scripts/show/24089

Kind of the same thing, but works at http://www.craigstoolbox.com

whoops, that should have been:

replace line 78...
for (j=0; j<m>

with...
for (j=0; j<5>

Lately, the only listings that have more than 4 images are the mass postings by used car dealers and real estate agents. I find these listings annoying so I limited the number of pictures my browser displays to 6. This way I can tell the mass postings apart from the casual users who are content with the 4 image fields supplied by Craigslist. To do this I replaced line 78....

for (j=0; j<m>

with...

for (j=0; j<6>

A W E S O M E !!!!!

this script rocks! craigslist is sooo much
better now.

Bug fix #1 (missing thumbnails):
the image preview won't appear if the original img tag in the ad has any attribute (style, border, etc.) before the source attribute. This can be fixed like so:

line 71, change (/img src=\"([^\"]+)\"/gi)) to
(/]+)>/gi))

line 84 & 85 change to:
s = s.split('src="')[1];
s = s.split('"')[0];


Bug fix #2 (small pics blown up):
Small images won't be enlarged if we change width & height to maxWidth & maxHeight in lines 105, 107, 166 & 168.

Improvement #1 (small-pics clutter):
To filter out small images, so that they don't even appear, add this code between lines 107-108:

img.addEventListener("load", function() {
if (this.height < size) {
this.parentNode.parentNode.removeChild(this.parentNode);
}
},true);

NOTE: improvement #1 will not work without bug fix #2!

Improvement #2 (enlarge thumbnail on mouseover):
right after the last event handler, add this code:

img.addEventListener("mouseover", function() {
this.style.maxHeight = 100 * size + "px";
if (!keepAspectRatio) {
this.style.maxWidth = 100 * size + "px";
}
},true);
img.addEventListener("mouseout", function() {
this.style.maxHeight = size + "px";
if (!keepAspectRatio) {
this.style.maxWidth = size + "px";
}
},true);

(100 is an arbitrary large number that sets the size ceiling high enough to not squash any pics.)

Canadians: The script has ".org" hardcoded, that's why it doesn't work on *.craigslist.ca. It's not enough to just add *.craigslist.ca to the list of sites it's applied to. You need to edit the script itself.

Currently line 180 in the showImages() function reads

    if (link.href && link.href.match(/.*craigslist.org.*\/\d+\.html$/)) {

Change that to read

     if (link.href && link.href.match(/.*craigslist.*\/\d+\.html$/)) {

I suppose the same applies for other ccTLD craigslists, if those exist.

Great script, thanmks. Two things:

How, exactly, does one "resize the image previews"?

Also, I agree with the previous commenter. The enlarged small images ought to be fixed.

Works great! One little quibble, some people put tiny images in their ads, which get blown up huge & get in the way. This problem can be fixed by adding an if statement around the resizing code, like so:

if (img.height > size) {
if (!keepAspectRatio) {
img.style.width = size + "px";
}
img.style.height = size + "px";
}

(First and last lines are new code). It needs to be done in both newFunction and changeSizes. I tested it, seeemed to work, but was a little buggy in the changeSizes function. I'm new to javascript, so I probably missed something...

Just wondering if it is still working for Craigslist Canadian postings. I can get it too work for all of the American cities, but when I try it with Canadian cities, it no longer works.
IE. http://toronto.craigslist.ca/sys/ no pictures at all. If you don't mind could someone click on the link and let me know if the images show up. Thanks Stoney

works perfectly in my single page test at http://toronto.craigslist.org/search/sss?query=hex

This works fine except for when looking at cars and trucks, the first image is a blank picture!
See example:
http://silenceisdefeat.org/~deltron/craigslist.png

Doesn't work in Opera... Would love it if you could make it work in Opera?

This is a great script!
Would there be any way to have the images show in real size on mouse over?

Works! You just need to wait a little as it retrieves them.

This script would be great... if it weren't so handicapped by only working on real estate pages. I don't understand how/why that is, I browse for furniture all the time, but houses only once in a while.

this doesnt work.

It worked perfectly for me, thanks!

this doesnt work.