Adapt an IMG to a new size after change its SRC?

I used to change the .src of an image to update a picture without reloading the whole page. It works finely in IE4 but not in Netscape if the pictures are not in the same size, in Netscape all the following photos rescaled to the first photo's size. Since the width and height of IMG are read-only, how to solve this problem?

I had to use two different versions for IE and Netscape, they're working at url weddingplus.com.sg/gallery/dayspring/


Hope to hear you solution soon. Thanks.



Chao Zhou
chaozhou@hotmail.com
175098Asked:
Who is Participating?
 
mapperConnect With a Mentor Commented:
Chao,

Use a white background to mount your images on (then make it transparent) if you choose a background that will be as large as your biggest picture - then you can mount the smaller images on it and (with a transparent background) it should reload properly on either browser - this solution maybe not too technical - but it will not be browser unfriendly.

Let me know how it works out...

best of luck...

mapper
0
 
jbirkCommented:
One way is to create a layer for each image and show/hide them when the suer clicks on a thunbnail...  This is DHTML though, and only 4+ browsers, and is also a pain in the neck sometimes with browser differences/wars.
Good luck!
I'd also like to know a non layer way but I don't think there is one unless you modify the pictures to all be the same size with just white space padding in whichever direction is needed..
-Josh
0
 
jbirkCommented:
mapper, unfortunately the smaller images will then be stretched to the large size in netscape.
-Josh
0
Cloud Class® Course: Python 3 Fundamentals

This course will teach participants about installing and configuring Python, syntax, importing, statements, types, strings, booleans, files, lists, tuples, comprehensions, functions, and classes.

 
mapperCommented:
Jbirk - not if they are mounted on a background that is the same size

Example:

largest image is 50 x 50 then create a colored background (doesn't matter it will become transparent which should be easy appears Chao is using Frontpage) then drop the smaller images on that background (two different layers) then when the image is saved as a gif the two layers merge into new picture that is 50 X 50 the background is then made transparent - the browser always sees images that are 50 X 50 but the person viewing the web page does not see the background image and the browse will parse the 50 X 50 so the load time should not be very significant...

mapper
0
 
jbirkCommented:
OK, I see what you are talking about.  This is exactly what I said with this line:
>>unless you modify the pictures to all be the same size with just white space padding in whichever direction is needed..

Same thing, different wording.  You have to modify each and every image this way, AND if you add an image which stretches the maximum horizontal or width then you have to change every image again...  this can be annoying!  But IT IS a solution and WILL work!  So that is a step in the right direction...

-Josh
0
 
175098Author Commented:
Hi Everybody,


Thanks for your advices and your visits to our web site at weddingplus.com.sg.

Besides the methods your mentioned, is there any other solution just through some programming or scripting trick, or not possible in Netscape currently.

Thanks,

Chao Zhou
0
 
175098Author Commented:
Hi Everybody,


Thanks for your advices and your visits to our web site at weddingplus.com.sg.

Besides the methods your mentioned, is there any other solution just through some programming or scripting trick, or not possible in Netscape currently.

Thanks,

Chao Zhou
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.