Win a copy of Murach's Python Programming this week in the Jython/Python forum!
  • Post Reply Bookmark Topic Watch Topic
  • New Topic

h:outputLink Image size  RSS feed

 
Mat Anthony
Ranch Hand
Posts: 261
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi All,
I have single image that I use to display within p:lightBox. I can set the width/height to display
the initial image (i.e. with h:graphicImage). I would like to use the same image to display it larger (i.e. within h:outputLink) without having to point to a different jpg.
Can I somehow specify the width/height of the image in h:outputLink



Mat
 
Tim Holloway
Bartender
Posts: 18531
61
Android Eclipse IDE Linux
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Actually, you should be able to scale the image by simply seeing the desired width/height on the h:graphic Image tag itself. The link's dimensions expand automatically to include all of its contents.
 
Mat Anthony
Ranch Hand
Posts: 261
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for the response Tim.
The <h:outputLink currently points to sport.jpg. Is this the image that lighBox uses to put in the expanded dialog box once you click on the original thumb nail image. If so how can I make this image display larger. I'm trying to get away
from storing the same image twice in the db (i.e different width/height values). Can you provide an example?

Mat>
 
Tim Holloway
Bartender
Posts: 18531
61
Android Eclipse IDE Linux
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
The HTML IMAGE tag (which is what h:graphicImage generates) references the URL of an image. The width and height attributes of that tag indicate the size it should be rendered at.

If the width and height on the IMAGE tag don't match the native width and height of the image itself, the client (browser) will scale the image to fit the requested width and height.

So the same URL can be used to render as different-sized images using different tags. Although you should check to make sure that the scaling process doesn't result in a blurry or pixellated image.

One of the most shocking things I ever saw done with HTML images was an app where someone had designed a set of graphic buttons as the main menu. He didn't realize, however, that the images had been designed to be 1600x1200 pixels, because he was using the IMAGE tags to scale them down to about 150x120 pixels on-screen. There were about a dozen of these critters, and each one required the download of a massive image file which then had to be intensively computationally processed by the client computer to get the scaling done.
 
Mat Anthony
Ranch Hand
Posts: 261
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for the response Tim :)
 
Consider Paul's rocket mass heater.
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!