[Solved] Request for another img-tag called shot!

[papercoffee]

Ok we have this problem that many pictures are much too big for this board.
Therefore I request an additional tag.
[shot] <= this tag works like the [img] tag but resizes the linked picture to the maximum width of the forum.
If someone want to see the real size can he click the image and get to its origin where it's hosted.

We can throw out the

• tag because it doesn't work properly anyway. Or I haven't found out how it works.
  But at any rate no one uses it.

[Wormbo]

1. This
2. tag
3. works
4. as
5. designed

Code: Select all

[list=1]
[*]This
[*]tag
[*]works
[*]as
[*]designed[/list]

And for the record: I used it this morning.

[edit]

1. alternate
2. list

1. and
2. another
3. one
4. (roman)

1. also
2. caps

Yup, works quite nicely.

[Barbie]

many pictures are much too big for this board

Instead of automatic generating a mini preview pic I'd use the HTML tags "width" and "height" while the forum's page is delivered to the browser. These HTML tags can limit the display size of an image. If user user selects "show image" in his browser, the image will be displayed in full original size.

Or the dimensions of an uploaded image can be limited simply.

But at any rate no one uses it

I use the LIST tag whenever it makes sense.

[papercoffee]

Code: Select all

[list=1]
[*]This
[*]tag
[*]works
[*]as
[*]designed[/list]

And for the record: I used it this morning.
[...]
Yup, works quite nicely.

Did see it the first time. Now I know it works.
Still the [shot] tag would make everything easier ...Especially EvilGrins could finally post pictures without me have to visit tinypic or ctrl- the whole forum.

@Barbie
I don't want a mini preview ...I want a similar function as they use on the Epic Forum. Like in this post.
https://www.epicgames.com/unrealtournam ... post185688
The post looks like this behind the stage:

Code: Select all

[QUOTE=papercoffee;185688]modified logos!

[shot]https://forums.unrealtournament.com/attachment.php?attachmentid=19153&stc=1[/shot]

[shot]https://forums.unrealtournament.com/attachment.php?attachmentid=19152&stc=1[/shot]

I still need feed back on the new Trident variation. ;)
S/M is still in the pipeline... maybe I can show something this weekend.[/QUOTE]

[Barbie]

The post looks like this behind the stage

Yes, they realized it as I suggested above with the WIDTH tag. The delivered HTML code of your mentioned web page for the image is

Code: Select all

<img title="This Image Was Automatically Resized by using the Screenshot Tag.  Click to view the full version" src="https://forums.unrealtournament.com/attachment.php?attachmentid=19153&stc=1" alt="This Image Was Automatically Resized by using the Screenshot Tag.  Click to view the full version" width="400">

width="400" does the trick. Work for phpBB modders - maybe there exists already a plug in?

[papercoffee]

The post looks like this behind the stage

Yes, they realized it as I suggested above with the WIDTH tag. The delivered HTML code of your mentioned web page for the image is

Code: Select all

<img title="This Image Was Automatically Resized by using the Screenshot Tag.  Click to view the full version" src="https://forums.unrealtournament.com/attachment.php?attachmentid=19153&stc=1" alt="This Image Was Automatically Resized by using the Screenshot Tag.  Click to view the full version" width="400">

width="400" does the trick. Work for phpBB modders - maybe there exists already a plug in?

Now I understand ...

Yes such a plug-in would be very useful. But Shade has to implement it.

[Barbie]

That solution with a fixed width is not really flexible: different users have different monitor and browser window sizes, so that width=400 may be too small or too big.
If I were asked how to implement this, I'd recommend using a small java script that sets the width to the current browsers canvas width ("responsive design").

[papercoffee]

That solution with a fixed width is not really flexible: different users have different monitor and browser window sizes, so that width=400 may be too small or too big.
If I were asked how to implement this, I'd recommend using a small java script that sets the width to the current browsers canvas width ("responsive design").

Wait, isn't there a % value in html possible? or was this just in CSS ...I don't remember.

[Barbie]

I did not find anything in the W3C standard about percent values as valid values for the WIDTH attribute. Anyway: You don't want to resize every image but only those where Width(Image) > Width(Canvas). So I guess that pure HTML nor CSS will not be enough to detect this. But this is only a guess - my knowledge in CSS is limited.

[Wormbo]

Fixed width can be fun... e.g. if you need an extra large version of (<-- is that another double-assigned smilies shortcut? I wanted ) or - which both seem relevant in a number of recent threads, as far as I can tell.

[Shade]

I've added the following CSS lines:

Code: Select all

.postbody .content img {
  max-width: 100%;
}

Test it by resizing your browser window. Is this solution okay?

[papercoffee]

I think it works great.

[Barbie]

Nice solution.

[Chamberly]

Awesome, this is great! Now I don't have to see very big pic taking over the places!

[Dr.Flay]

Personally I would be happier if people learned the difference between images for print, and images for the web.
You should prepare images for the intended use.
If you post large images with lots of colours, don't use PNG, but if you must because some one needs to print it, then set it as "interlaced" or "progressive"
Only use 24bit PNG if you were going to use a TIFF, and use 8bit PNG as a GIF replacement.

People tend to ignore other people data limits and costs, when they are not as limited.
When browsing on a mobile device I switch off images because it eats my credit like crazy.

As a "general rule of thumb" your desktop resolution is not suitable for web pictures, no matter what it is.
Before you upload to any site, consider using a tool like RIOT.
http://luci.criosweb.ro/riot/
In full automatic mode you can see the optimisations you should be doing in your other software.