Advertisement:

Author Topic: Auto resizing of images in posts, etc by CSS.  (Read 113565 times)

Offline singhabhishek251

  • Newbie
  • *
  • Posts: 9
Re: Auto resizing of images in posts, etc by CSS.
« Reply #20 on: June 05, 2013, 08:50:09 AM »
A good explanation about image resizing and this is what many newbie get confused, we can fix the size of any image according to requirement with width and height attribute, but in most cases the image gets deformed and you do not get perfect high quality image. If possible try to use photoshop to resize and if doing for dynamic value, then use codes.

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #21 on: June 05, 2013, 10:07:27 AM »
Antechinus,

One last thing, out of those pics (towards top of thread), which one will this code refer to?

Well said sir! Also, its always a good thing when multiple people benefit from someone's answer.  ;)

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #22 on: June 05, 2013, 06:41:49 PM »
All of them. Those pics just show how the same images will resize to suit screen resolution.

Offline GL700Wing

  • Jr. Member
  • **
  • Posts: 269
  • Gender: Female
Re: Auto resizing of images in posts, etc by CSS.
« Reply #23 on: June 06, 2013, 06:39:01 AM »
Quote
If anyone wants bulletproof resizing of images ...
Fantastic tip - many thanks for sharing!

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #24 on: June 11, 2013, 10:10:16 AM »
Antechinus,

What is the difference between the first code and the code for attachments under posts?

Will it mess with the avatars?
 
What does the first code do to my SMF Gallery pictures that are uploaded?

I know I already asked but how does my forum know which pics size to use?
« Last Edit: June 11, 2013, 11:10:36 AM by CheeseHead05 »

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #25 on: June 11, 2013, 06:07:37 PM »
Antechinus,

What is the difference between the first code and the code for attachments under posts?

Will it mess with the avatars?
Read the comments in the code. They tell you what each block does.

Code: [Select]
/* Auto resizing of avatars in posts and personal messages. */

................

/* Auto resizing of avatars in default theme header. */

..........etc.


Quote
What does the first code do to my SMF Gallery pictures that are uploaded?

Dunno. Haven't used a gallery mod. Try it and see. :)


Quote
I know I already asked but how does my forum know which pics size to use?

Eh? Either the default SMF admin settings tell it, or this CSS does, depending on which method you're using.

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #26 on: June 12, 2013, 10:57:32 AM »
Antechinus,

The code seems to work in my gallery! Thanks for the much needed help.. :)

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #27 on: June 12, 2013, 11:01:56 PM »
Antechinus,

I dont know what happened but my when I upload a pic, it goes back to the small one again. I went to my css file and the code is still there. Any idea?

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #28 on: June 13, 2013, 07:30:29 AM »
Nope. Like I said, I've never used a gallery mod. You'd have to ask the person who made it.

Offline TomW

  • Jr. Member
  • **
  • Posts: 293
  • Gender: Male
Re: Auto resizing of images in posts, etc by CSS.
« Reply #29 on: June 13, 2013, 08:40:32 AM »
Antechinus, thank you, this is awesome !  I've been looking for a simple solution like this.

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #30 on: June 13, 2013, 09:49:31 AM »
Nope. Like I said, I've never used a gallery mod. You'd have to ask the person who made it.

Im talking about my forum attachments and not gallery.

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #31 on: June 13, 2013, 06:08:20 PM »
So what have you got in your admin settings for attachments? If you're forcing it to make thumbnails in admin, that will override the css.

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #32 on: June 13, 2013, 10:20:54 PM »
So what have you got in your admin settings for attachments? If you're forcing it to make thumbnails in admin, that will override the css.


Max attachment folder space = 10240 kb

Max attachment size per post = 192 kb

Max size per attachment = 128 kb

Max width of thumbnails = 0

Max height of thumbnails = 0

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #33 on: June 14, 2013, 07:48:59 PM »
Odd. I'll try it on a local 2.0.x site and see what happens.

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #34 on: June 16, 2013, 04:28:23 PM »
ok let me know..

Offline themavesite

  • Jr. Member
  • **
  • Posts: 177
Re: Auto resizing of images in posts, etc by CSS.
« Reply #35 on: June 18, 2013, 04:17:39 PM »
I just added the code from your first post to my theme's index.css, and uploaded the file again.
Though I see no changes whatsoever :/
Any idea what may cause this? (yes admin image limits are disabled)

my forums: http://forums.themavesite.com/
css link (code is at bottom) http://forums.themavesite.com/Themes/oldblack/css/index.css

As you can see here http://forums.themavesite.com/index.php?topic=5469.new#new it's clearly not working yet.

I just don't see what I'm doing wrong here..
TMS Forums
Since 2008 and still going strong! Join today! http://forums.themavesite.com/index.php

Offline CheeseHead05

  • Jr. Member
  • **
  • Posts: 388
Re: Auto resizing of images in posts, etc by CSS.
« Reply #36 on: June 19, 2013, 09:40:07 AM »
themavesite,

Im having the same issue as u..the craziest thing about that code is that I added it to the end of my css like Antechinus said, it worked the first day I did that but the second day I went to upload a picture and it did not resize itself instead it was a very small picture...I know this definitely sucks... :-\

Offline themavesite

  • Jr. Member
  • **
  • Posts: 177
Re: Auto resizing of images in posts, etc by CSS.
« Reply #37 on: June 19, 2013, 02:21:19 PM »
This method works extremely good, until you have an image shaped like a large standing rectangle.
Then it completely fails.

Try using this method for this image for example: http://i.imgur.com/24Ogz7H.jpg
It resizes to a point where you can't properly read it any more.

Sorry to disappoint you people, but this is not "the" method.
TMS Forums
Since 2008 and still going strong! Join today! http://forums.themavesite.com/index.php

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #38 on: June 19, 2013, 06:02:43 PM »
themavesite,

Im having the same issue as u..the craziest thing about that code is that I added it to the end of my css like Antechinus said, it worked the first day I did that but the second day I went to upload a picture and it did not resize itself instead it was a very small picture...I know this definitely sucks... :-\

Do you have all of these disabled?

Resize images when showing under posts

Save thumbnails as PNG

Maximum width of thumbnails

Maximum height of thumbnails

ETA: Also, just tweaked the code in the OP.
« Last Edit: June 19, 2013, 06:14:06 PM by Antechinus »

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,136
  • Master of BBC Abuse
Re: Auto resizing of images in posts, etc by CSS.
« Reply #39 on: June 19, 2013, 06:06:20 PM »
This method works extremely good, until you have an image shaped like a large standing rectangle.
Then it completely fails.

Try using this method for this image for example: http://i.imgur.com/24Ogz7H.jpg
It resizes to a point where you can't properly read it any more.

Sorry to disappoint you people, but this is not "the" method.

So if you want to show images like that at full size, change the max-height in the CSS. I did tell people to adjust it to suit their preferences.

I prefer to have images like that not displaying at full height by default, because they're a nuisance when I either have seen them before or aren't interested in them. If I want to see such an image full size, I just right click > view image.

That's why I set a max-height of 640px. If you want a max-height of 3,247px, set that instead. :)