This is a follow-up to the news post below by Evilagram.
Sadly this is not testable in the beta version. But it is in the Alpha version 3.6, below explains you how to do it. Be awre that this fix is completely at own yourrisk, as 3.6 of it is not stable yet.
Step 1
http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-trunk/Download Minefield. This is the project name for alpha releases of Firefox. On that page you can download it, for windows that would be firefox-3.6a1pre.en-US.win32.installer.exe
Step 2
Install minefield. It will not overwrite your existing version of firefox, but wil copy your bookmarks , add-ons, passwords etc.
If you go to pixeljoint.com right now in your new Minefield browser you can already see the images crispy when you zoom in. This because it seems PJ already added the right tags to its css. Thanks!
Step 3
To get the pixel zooming on every website you visit (such as www.pixelation.com) we need to take another step.
We must create a file named userContent.css
This CSS file will apply the code in it to every page you visit.
In windows, this page must be created in %appdata%\Mozilla\Firefox\Profiles\profilename\chrome
You can find it by browsing to C: > Documents and settings > 'Username' (mine is Daniel) > Application Data.
Application Data is a hidden folder, you can unhide it by going to (in your explorer) Tools > Folder Options > View > Show hidden files and folders
http://www.bleepingcomputer.com/tutorials/tutorial62.html
Non windows users must figure it out themselves, but the file will always be located in Profilename\Chrome
Now open notepad or a similar text editor, and paste in this code:
img[src$=".gif"] { image-rendering: -moz-crisp-edges; -ms-interpolation-mode: nearest-neighbor; }
img[src$=".png"] { image-rendering: -moz-crisp-edges; -ms-interpolation-mode: nearest-neighbor; }
Save it as userContent.css (and watch out it does not become a .txt but a .css) in the chrome folder
Thats it. You are done! When you click images on any site to zoom in, they will be shown ina ll its pixel glory (after you restart your browser).
If you have any questions, comment!
I've been trying this out with firefox 3.6 beta 5. It works perfectly, except there's one minor quirk. You need to add two more entries into usercontent.css. One for ".PNG" and another ".GIF". It seems stupid, but .PNG is thought of as seperate from .png. I guess an entry for pNG, pnG, PnG, etc. are needed as well, but I doubt those kinds of capitalizations will be stumbled onto. If you want to see an example of an image endeding in .PNG failing, check out the first image link on this page. http://dwarffortresswiki.net/index.php/Graphics_sets
the difference between 2 and this is around zero?
Of course, they look the same by apperance, but there is much more than that. MUCH more than that. You are talking about a complete new generation of a program, that has already evolved a lot too!
This also works with latest Opera (9.64) which is not alpha version, like FF 3,6
that or use FF2 since the difference between the 2 version is around zero.
The only difference for you should be that the Documents and Settings folder has a different name. But you can also just enter %appdata% in the address bar of the Windows Explorer to get to the desired directory directly.
and 4 spanish speakers? i can add the fix to my firefox in spanish?
Doh, ok, now it works. Reading isn't such a bad idea ... thanks!
Like I said: You misspelled it. create a file and name it USERCONTENT! NOT userCHROME
userContent CONTENT CONTENT NOT CHROME .css
And all that needs to be in there (as you do not have an existing file yet anyway) are those 2 lines I posted.
I did just like you described, and it doesn't work for me. The filename is spelt correctly, there's only one Firefox profile where I put it, so that can't be the mistake either. Here's a screenshot: http://elitepigs.de/trash/usercontent.gif
name it userContent, witha C not a c. A caption.
And put it in the right folder, as described in my tutorial. Really, it works 100% sure if you do it right.
i made the usercontent.css but it doesn't work on pixelation
yes, you should make that userContent.css to get it working on pixelation!!
This solution doesn't work for me on Pixelation - it still blurs the pictures, although not as strongly as before it seems. It works fine here on PJ. Any ideas?
I was looking at a firefox extension called stylish and it seems like it can edit the usercontent.css for individual websites. Maybe a firefox addon could be created that adds an option under the Tools menu to apply pixel art filtering to the current website or all sites.
 |  |  |  |
indeed, I am using that myself too. Thanks for adding it to the thread!