+ Start a Discussion
SarisfdcSarisfdc 

Limit Size of image on Visualforce page

I am displaying image on the VF page.
I want to set maximum size of image VF on page.
Lets suppose if image size is 640x480 then it should become 360x240 on VF page- I achived this by putting mx-width style.
But I want if image size is less than 360x240 then it shows its original size, it should not stretch and show into 360x240 size.
 
Mikhail Muzo 7Mikhail Muzo 7
The easiest way is to Use the image tag and the Style attribute with max-width and max-height;
I just tested and the image is not streched out. I created a new vf page here is the code:
 
<apex:page >
    <apex:image url="http://www.sfdc99.com/wp-content/uploads/2014/10/adm201.jpg" style="max-height:300px;"/>
    <apex:image url="http://i.stack.imgur.com/oIjFj.png" style="max-wiidth:300px;max-height:300px;"/>
</apex:page>

the first image is greater than 300x300 (It was perfectly scaled) and the second image is less than that (It did not streched out in any way). 

You can also give them a styleClass and specify those attributes by CSS class I think they should work the same
Vasani ParthVasani Parth
Sarisfdc:

There can be two options with your question
  1. Try <apex:image URL="/servlet/servlet.FileDownload?file={!recordId}"/>. You can change the required fields here.
  2. The other option is to upload a zip file containing my images to the Static Resources which can then be referenced.