[jQuery] Dynamic Image resize problem
Hi,
i am having an image resize problem. i have an DIV with width of
"100%" what i want is to make any image that comes in this DIV exactly
the size of DIV is. Basically this DIV is having the half of my total
layout i.e. whole right panel 50% of the total layout.
What i would like to have is to have is whatever size image comes in
this DIV automatically resize it to occupy the full width of the DIV.
For this purpose i am using below code.
$(document).ready(function(){
$("#news img").each(function(){
$(this).width("100%");
});
});
I think code is self explaintory. It is working fine however i am
having an problem. The images are coming from any other site such as
http://imagesite.com/imagepath . Now what's happening is suppose 2
images are coming from the site Ist one is having width of 450px and
2nd is of width of 900px. I have put this code in ready function so
first it allow the images to load with their original size such as 450
and 900 . When Dom is ready then the code starts to work but the 2nd
image already stretches DIV to 900 so Ist image takes 100% there for
it stretches itself to 900px and the whole layout goes all over the
place.
What i need is if an image has more width than the DIV it should
resize to the width of DIV.
Please help me out with this code OR anything plugin or anything that
can solve my purpose. I don't want to use defined width like 400px
etc.
Please help
Thanks