BBcode Image dimmension restrictions???

[Daron]

Hey i have something on my game when players can make like biography/journal/diary whatever u wanna call it, and they can use bbcode, and i know most people just dont allow images but come on what player dont like to share images xDD BUT i dont want anyone to post any humongous image and mess things up, so is it a way to put a limit on the dimmensions of images posted using bbcode?

[a_bertrand]

You could load the image on the server, and resize it or present to display if it doesn't fit the requirements. Of course that will increase your server usages.

[risingsparky]

Use javascript to loop through all images within bbcode designated areas and size them down to a maximum specified size if required.

If you know how to use jQuery, you'll be able to do this in well under half an hour.

[a_bertrand]

Backdraw of this is that the image will load at it's full resolution and then be rescaled by the browser, which means for the user a slow loading.

[Djkanna]

Well I imagine, you convert [.img][./img] into <img>, so apply width/height limits to the img tag (the browser does an okay job a resizing images), this saves creating a copy on your server and manually 'looping through all images'.

If you want to get clever, you can modify your bbcode parser to allow you specify whether or not you want to apply dimension limits on images and specify what the dimensions you desire.

(Doesn't change the above fact)

*Is to lazy to post code examples, so he lets Bluegman991 do it. :p VV

Edited August 21, 2012 by Djkanna

[bluegman991]

What DJK said^^

You could create a css class like this: (changing max width/height to whatever you prefer)

img.bbimg {
   max-width:500px;
   max-height:500px;
}

 

and add

class="bbimg"

to the img tag.

[Daron]

What DJK said^^

You could create a css class like this: (changing max width/height to whatever you prefer)

img.bbimg {
   max-width:500px;
   max-height:500px;
}

 

and add

class="bbimg"

to the img tag.

ohhhh that makes sooooooo much sense thanx everyone! dont know what i would do without this forum ^_^

[a_bertrand]

Not sure if max-width / max-height works with all browsers... You should try with IE, FF and chrome and see how it goes.

[Dave]

max-width and min-width along with a jQuery fallback is probably your best bet.

Then it will work with all browsers.

$('.bbimg').each(function() {
if($(this).width() > 500) { $(this).width(500); }
});

Something like that, it's early so probably won't work.

[bluegman991]

I believe it's only ie6 that doesn't have max-width.

[rulerofzu]

http://www.quirksmode.org/css/contents.html

Buggy in IE5 removed in IE6 made a comeback in IE7 and onwards.

[lucky3809]

There are hacks in making it work in all browsers, however you would need to find them on google because there is many ways in doing it. I would post, but last time I did someone picked my post apart, so trying to refrain from doing so.

There is also the code facebook uses floating around to on google.