I've just released a new feature that allows images to be dynamically resized from within messages. For example, if you hover the mouse over this image you will see a little magnifying glass cursor with a plus. Click on the image and it will grow to full size:
The magnifying glass cursor now has a minus. Clicking on the image again will return it to its original size.
There are a few changes to the way the [img] and [thumb] dBCodes work:
The [img] dBCode used to display images left-justified, it now displays them centered by default.
The [img] and [thumb] dBCodes now accept the identical option arguments. The only difference between them is that the default size for the [img] dBCode is the actual image size , but only up to 600 pixels wide. Larger images are displayed at 600 pixels wide but can be expanded to full size by clicking on the image.
The default width for the [thumb] dBCodes is 100 pixels.
The options now accepted by the [img] and [thumb] dBCodes are image width (an integer), horizontal alignment left, right or center, and a caption. An equals sign (=) must appear after the dBCode and before the option list. Multiple options must be separated by commas.
An example of specifying an image width:
An example of specifying an image width and an alignment:
The alignment options are left, center, right, floatleft and floatright, for example:
Using the right option the above image would have displayed like this:
The floatleft and floatright options allow text to flow around the image. For example, this uses the floatright option:
This text should appear next to the image instead of above or below it. I'll just run on for a few more lines here so that you can see how this would appear with a paragraph of average length. There, that should be enough text. No, I guess it wasn't, so let me go on typing for a bit more. The cat's brother was here in the room a minute ago, but not now.
I can add an option to make the image bigger while still using the floatleft option. Here I've widened the image to 200 pixels:
This text should appear next to the image instead of above or below it. I'll just run on for a few more lines here so that you can see
how this would appear with a paragraph of average length. There, that should be enough text. But with the bigger image this is no longer enough lines, so I'll have to add some more text. There, hopefully that's enough. Nope, wasn't enough, so I guess I have to keep typing here. Well, as you can all see, this is a really neat feature, and you can still click on the image to change it's size. The text will reformat to flow around the larger image. This last sentence should completely surround the image with text, if I can just run on for long enough. My fingers are getting tired.
Captions can be added by using the caption option. The caption must be separated from the caption text with a colon (, and the caption cannot contain a comma because that is the character that separates multiple options. Here I combine a caption with a width of 300 like this:
[thumb=300,caption:This cat is eating plastic leaves.]
It looks like this:
This cat is eating plastic leaves.
I'll be updating the documentation on the dBCodes help page soon.