Forum Display Enhancements - Resize large [IMG] images and link them to original

This mod should resize [IMG] images wider than 'max_width' and link them to their original size. Not very well tested, i'm hoping for some feedback/suggestions. I have tested in firefox/IE latest versions and it seems to work fine. Should be a pretty quick install.

INSTALL:

1) Edit /includes/class_bbcode.php around line 1879 for me.

Look for:

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

Change to:

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

2) Add the following to the headinclude template.

<if condition="THIS_SCRIPT == 'showthread'">

<script type="text/javascript">

max_width = 700;

if(document.documentElement.outerHTML == null) {
   HTMLElement.prototype.__defineSetter__("outerHTML", function (sHTML) {
   var r = this.ownerDocument.createRange();
   r.setStartBefore(this);
   var df = r.createContextualFragment(sHTML);
   this.parentNode.replaceChild(df, this);
});
}

function resizeImages() {
   for(var i=0; i<document.images.length; i++)
   {
      var img = document.images[i];
      if(img.className == "img_tag") {
         if(img.width > max_width) {
            var strNewHTML = '<a href="' + img.src + '" target="_blank"><img width = "' + max_width + '" src="' + img.src + '" border=0 alt="" /></a>';
            img.outerHTML = strNewHTML;
         }
      }
   }
}

if (window.addEventListener) {
  window.addEventListener('load', resizeImages, false);
} else if (window.attachEvent) {
  window.attachEvent('onload', resizeImages);
} else {
  window.onload = resizeImages;
} 

</script>

</if>

[PersianImmortal]

No, you're right, I just checked your page and it works in Firefox, but not in IE7 - the second set of pictures are not resized for some reason.

On my site however it seems to work, here is a thread from my site which has it working: http://forums.tweakguides.com/showthread.php?t=4535

Note that I edited my post on the bottom of the first page to include the same images again, and as you can see both the top set of images and bottom set of images should be working (at least they are for me in Firefox and IE7).

So maybe there's something in particular about your forums which is causing this? Any feedback from others will also be helpful.

[newbe_haselina]

You're right, I just tested it with the Mozilla/Firefox Browser, and it works perfectly :cross-eyed:

Hmmmm, hopefully most of my users use Mozilla ... but anyway, even if it doen't work 100% with IE, it's an improvment for my community

[principino1984]

I found out why this hack is not working on my forum...

this is what I see with IE:



and as I click on the image... see the url:




Well, this is the problem, when this hack tries to resize the picture, it changes the url and thats why the image "disappear" on firefox..

can you help me?

thanks a lot

Marco

[PersianImmortal]

For the code I've posted on the previous page, I've tested it in Firefox 1.5.0.7 and Firefox 2 RC1, as well as Internet Explorer 7 and it doesn't seem to have any problems at all, working perfectly on my forum (see test link further above).

All I can suggest is that you follow the instructions to edit your class_bbcode.php file first, then try using the original code for the hack to see if it works, then try replacing it with my code instead and see if it works.

[principino1984]

where do I find those instruction... cause the hack is workin right i think, but it still write me the url like this:

http://yurlmyforum/http://imageurl

where do I have to chage to make it ok?

Marco

[nsanden]

Ah I see. Well the screen shots help, but I really need to view the page myself (so I can view the source).

Originally Posted by principino1984

I found out why this hack is not working on my forum...

this is what I see with IE:



and as I click on the image... see the url:




Well, this is the problem, when this hack tries to resize the picture, it changes the url and thats why the image "disappear" on firefox..

can you help me?

thanks a lot

Marco

[principino1984]

i think the problem is VBSEO that rewrite all the links... right now i've just installed another hack, but If it helps you for the support for the other guy I can post you my headinclude or just tell me what do you need

Marco

[nsanden]

If you can link me to the thread in your screen shot that should be all i need. Of course if you installed another image resize hack and uninstalled mine, I won't be able to figure out the problem Up to you, my guess is you are right, its just another hack conficting with it.

Originally Posted by principino1984

i think the problem is VBSEO that rewrite all the links... right now i've just installed another hack, but If it helps you for the support for the other guy I can post you my headinclude or just tell me what do you need

Marco

[GoNz00]

seems to be working fine here, the "other" image tag resizer lagged the forum to hell and back, may have been the .js file included. normal speed resumed with this one

[egelforum]

Anyone with vB 3.6.2 around? I can't get to work ANY of this image resize addons. Not even one. They just don't do anything. I think the cause is an incompatibility with 3.6.2.