Show Thread Enhancements - Dynamic Picture Resize for [IMG] tag

If an image submited by a user (using the [IMG] bbcode tag) is to big, chances are that it will break your current vBulletin style. This hack will dynamically resize that image to acceptable dimensions, that you previously specified. It will do it for pictures inserted into postbit or user signature.

The code modifications listed below were tested into a clean installed vBulletin board. They work 100%.

Installation
In order to perform an efficient modification of your files, I recommend you to use Komodo Edit or Textpad.
Both editors will allow you to complete all steps without any coding errors.

You will need to make one small change for each of the following files:

? vbulletin_global.js (folder /clientscript)
? class_bbcode.php (folder /includes)

Make sure you modify, save and upload one file at the time to your server.
Then, simply run the product-dynamicpic.xml file.

Once the product installed, don't forget to enable it.
Go to your vBulletin Options, click on Dynamic Picture Resize setting group and set all your options.
If you encounter any problems, feel free to post in the support thread.

Learn how to open the image into a new tab/window.
But you should stop using the target tag, since it will be deprecated soon.
There is a reason why all browsers have now the Shift and CTRL options to open a new tab/window with the link you click on.

[eghm]

Thanks for this Product!

I'ld like to suggest updating the readme.html CSS Main edit from "second text area" to "Page Background: Extra CSS Attributes" adding that the Main CSS is under the Style Manager might help newbies a bit too.

I've installed this on my testvb and see it works for FireFox. On Safari (Mac OS X browser) the image looks squeezed (which I can live with, given the see full sized image option) and the css doesn't work correctly (which I probably can't live with) - http://s229.photobucket.com/albums/e...zeOnSafari.png

[Acers]

TECK, great hack m8,
just wondering though, when the javascript detects a image is greater than specified, can't the link window be somehow set to say rel="lightbox" and then the final image opens up in a new lightbox window?

EDIT: Never mind, i got the lightbox working with this code. Works brilliantly now.

[offline]

Hello! I have installed this and it works great, I only have on small problem. The image is not clickable to view the orginal. I am using IE7. Any help is appreciated. http://www.chattanoogans.com/forums/...ge-resize.html

Thanks!

[offline]

Sorry, try this post... http://www.chattanoogans.com/forums/...size-test.html

[sportsoutlaw]

I have been looking or something like this, thanks for your work Teck

[TECK]

Originally Posted by Acers

Just wondering though, when the javascript detects a image is greater than specified, can't the link window be somehow set to say rel="lightbox" and then the final image opens up in a new lightbox window?

You could use this:

obj.rel = 'lightbox';

[TECK]

Originally Posted by offline

I only have on small problem. The image is not clickable to view the original. I am using IE7.

This hack was tested and working in all major browsers.

[Acers]

Originally Posted by TECK

You could use this:

obj.rel = 'lightbox';

yes teck, i had got that working.
thanks anyway.

[Mosh]

Hi Floren,

Just to let you know that this works on v 3.5.x with no changes apart from editing the product to remove the version dependancy. I works great.

Only one thing I would request, as some others have requested, is to add a label/notice to let people know that it is a resized image. This is not urgent, but would be a great help for people who do not read announcements or bbcode descriptions.

Thanks

[Charlie98902]

Wrong Thread sorry.