Auto resize large image

In fact this is a work around for the auto resize feature to work with the WYSIWYG editor.

Step1. In includes/class_bbcode.php

Find (in line around 18xx):

return '<img src="' .  $link . '" border="0" alt="" />';

Replace with:

return '<img src="' . $link . '" onload="if(largerThan(this.width,700)) {this.width=700;this.alt=\'Click here to see a large version\';}" onmouseover="if(this.alt) this.style.cursor=\'pointer\';" onclick="if(this.alt) window.open(\'' . $link . '\');" border="0" />';

Step2. Modify the common template of your template set

Add this to the headinclude section:

<script type="text/javascript">
function largerThan(a,b)
{
return a>b;
}
</script>

Demo:
http://talkmusic.org/showthread.php?t=3165

[swantonio]

good grazie ... .-)

[Allan]

Simple effective, I like

congratulation

"Click Install"

[nokturno]

congratulation

[Pramodinfo]

*Clicks Install* Thanks

[CBE]

This is the best image resizer i have seen,,
thank u very much

[COBRAws]

What's the way for adding a text that says something like "Click on the image to see orginial size"?

ORIGINAL MOD:

return '<img src="' . $link . '" onload="if(largerThan(this.width,700)) {this.width=700;this.alt=\'Click here to see a large version\';}" onmouseover="if(this.alt) this.style.cursor=\'hand\';" onclick="if(this.alt) window.open(\'' . $link . '\');" border="0" />';

WITH TEXT BELOW:

return '<img src="' . $link . '" onload="if(largerThan(this.width,700)) {this.width=700;this.alt=\'Click here to see a large version\';}" onmouseover="if(this.alt) this.style.cursor=\'hand\';" onclick="if(this.alt) window.open(\'' . $link . '\');" border="0" /><br /><p>Click on the image to see original size<p />';

Someone please tell me if this is ok.

[Barakat]

iam useing this and its usefull also .
in the same file and the same code just find this code :-

PHP Code:

return '<img src="' .  $link . '" border="0" alt="" />'; 


replace it with :-

PHP Code:

return '<div style="width: 800px; overflow: auto;"><img src="' .  $link . '" border="0" alt="" /></div>'; 


it will give u a frame on large pictures and will save ur style as it is .
just choose the width as u want the picture to be shown and thats all ...

any way i will try ur code also

[Xplorer4x4]

This belongs in the code modification forum as it it edits one of the orignal vB scripts.

[Snake]

I've been looking for this. Thanks!