Miscellaneous Hacks - Image Resizer Javascript

Image Resizer Javascript

With this simple javascript, if an image posted in your forum in a thread has a width that is larger then 80% of your browser resolution, it will be automagically resized. The image will also resize as you increase or decrease your browser size, so it is great for fluid styles. This javascript only affects images that are shown when viewing showthread.

NOTE: This is only a simple javascript to resize the image, there is no option to view the image at it's original size, etc., if you want to do that all you need to do is right-click on the image and choose "View Image." It does not do server side resizing of images, since everything is done client side. It also does not prevent long loading times, since the images have to be downloaded by the user before the script can resize them. If a user does not have javascript enabled then the image will not be resized - however if a person is browsing the internet, and do not have javascript enabled then an image that is too large will be the least of their worries.

This should work with all versions of vbulletin

Unlike other image resizing mods, this mod only requires one simple template edit, and no additional files , plugins, database changes or file edits.

DEMO LINK: CLICK HERE

Screenshots:
Imagine a picture that is too large, now imagine it smaller.

Installation:
If you have TMS (Template Modification System) installed, then download the templateedits-resizeimage.xml and upload it via TMS, and it will automatically edit the template.

If you do not have TMS installed, then download the image_resizer.txt file and follow the directions.

If you find this useful, please click install.
If you REALLY like it then please nominate it as Mod of the Month.

[abhimation]

Its really handy. Thnx Yoyo.. marked as Installed !

[Magnumutz]

Originally Posted by yoyoyoyo

read the first post

My bad... i didn't read that carefully.

[livethedream]

Livethedream clicks *installed*

[Calash]

It is not working on IE 6 where I work. Firefox it is working fine. It is a nice effect, simple but it gets the job done.

[yoyoyoyo]

Originally Posted by Calash

It is not working on IE 6 where I work. Firefox it is working fine. It is a nice effect, simple but it gets the job done.

I have tested it in safari, IE6, IE7, opera and firefox and it works fine in all of them. Make sure you have javascript enabled at your work browser - your sysadmin may have disabled it for some reason.

[Calash]

I'm in the IT group, so I know it is not disabled. It may be the version the Java VM that we have installed, though I have not see issues before. I will troubleshoot it a bit more and let you know if I find what the cause it.

[stan111]

this is awsome, love it
here is another suggestion:
if you would make the the image in the quote would show only the link, it would be awesome

[yoyoyoyo]

Originally Posted by stan111

this is awsome, love it
here is another suggestion:
if you would make the the image in the quote would show only the link, it would be awesome

Glad you like it, but I do not plan on extending or modifying this hack at this point - it is a simple javascript, and it works in all major browsers that I have tested. I see no need for extra features, especially ones that would require file edits.

[agitated]

Demo works fine in firefox but not in IE7. .
Unfortunately IE7 is still the most popular browser.

[yoyoyoyo]

Originally Posted by agitated

Demo works fine in firefox but not in IE7. .

make sure you have javascript enabled in IE7 - I am testing it right now and it works for me.

JavaScript - to enable this in:

IE Tools/Internet Options/Security/Custom Level button/Settings/Scripting/
Ensure the "Active Scripting" radio button selected.

Netscape Edit/Preferences/Category Advanced/Scripts and Plugins/
Under "Enable JavaScript for", tick the "Navigator" setting.
Under "Allow script to", tick "Change images" and "Change status bar".

Firefox Tools/Options/Web Features/
Ensure the "Enable JavaScript" radio button selected.