• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1401
  • Last Modified:

resize images to 100% width, keep height in proportion?

Hi,
I'm trying to show an image or a swf (depending on whether the user has flash) inside a browser window that has been already resized to full screen width and height.

The image & swf are 2:1 proportions, and I need to find a way to display them at 100% width, and to set the height to half of the height.

I have some of the pieces, but can't connect them...

for example var imgWidth = screen.availWidth; and var imgHeight = imgWidth / 2; gives me the height & width I want, but how do I write javascript variables inside an html tag?

ie <img src="images/abc.jpg" width="imgWidth" height="imgHeight"> - how do I write the width & height variables here?

thanks...



0
hc0904pcd
Asked:
hc0904pcd
  • 2
1 Solution
 
DireOrbAntCommented:
document.write('<img src="images/abc.jpg" width="'+imgWidth+'" height="'+imgHeight+'">');

However that's not the best way. Best way is to stick an img tag with an id like id="MyImg"
Then:
document.getElementById('MyImg').width = imgWidth;
document.getElementById('MyImg').height = imgHeight;
0
 
hc0904pcdAuthor Commented:
thanks, that's exactly what i needed :)
0
 
DireOrbAntCommented:
:)
0

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now