JQuery resize thumbnail image?

I read this too quickly. So I'm heavily editing my answer $(document).ready() runs as soon as the DOM is rendered. The images aren't loaded yet and the only information the DOM has about them so far is what is in the img attributes.

This is also true of the container div, which hasn't stretched its height yet to accomodate the images. That's probably why you get the same dimensions every time. Ideally you should manually set width and height of the images as well as the container div.

If you don't want to do that, you can use $(window).load() which will wait for all of the images to load and the DOM to be re-rendered, but this is very obvious to see left' and 'top' only work on elements that are 'position: absolute;' and within a container with 'position: relative;'. So the images need to be absolute and the div above them relative for left and top to work I'm not sure why you're using left and top instead of width and height, since you're trying to make a thumbnail. Another way is to calculate the maximum of the width and height and scale it down to a desired width or height var max_width = 20; var max_height = 20; $('#portfolio div a img').

Each(function() { var w = $(this).width(); var h = $(this).height(); var scale = null; if (w >= h) { if (w > max_width) { scale = 1 / (w / max_width); } } else { if (h > max_height) { scale = 1 / (h / max_height); } } if (scale) { $(this). Width(w * scale); $(this). Height(h * scale); } }) I hope some of this clarifies enough to let you work a proper solution out.

I read this too quickly. So I'm heavily editing my answer. $(document).ready() runs as soon as the DOM is rendered.

The images aren't loaded yet and the only information the DOM has about them so far is what is in the img attributes. This is also true of the container div, which hasn't stretched its height yet to accomodate the images. That's probably why you get the same dimensions every time.

Ideally you should manually set width and height of the images as well as the container div. If you don't want to do that, you can use $(window).load() which will wait for all of the images to load and the DOM to be re-rendered, but this is very obvious to see. 'left' and 'top' only work on elements that are 'position: absolute;' and within a container with 'position: relative;'.

So the images need to be absolute and the div above them relative for left and top to work. I'm not sure why you're using left and top instead of width and height, since you're trying to make a thumbnail. Another way is to calculate the maximum of the width and height and scale it down to a desired width or height.

Var max_width = 20; var max_height = 20; $('#portfolio div a img'). Each(function() { var w = $(this).width(); var h = $(this).height(); var scale = null; if (w >= h) { if (w > max_width) { scale = 1 / (w / max_width); } } else { if (h > max_height) { scale = 1 / (h / max_height); } } if (scale) { $(this). Width(w * scale); $(this).

Height(h * scale); } }); I hope some of this clarifies enough to let you work a proper solution out.

I have tried and I see the same as before. The problem is I don't know how to make that the loop works fine, because posLeft and posTop always have the same value, and they are the correct measures for the first image. – Les Paul Sep 18 at 15:05 Sorry, I have been busy the last two days and I couln't answer you.

I have tried your idea and it works. I thought I could do it on my way but it's not sufficient. I should have to learn some more javascript before.

Thanks for your help! :) – Les Paul Sep 21 at 8:26.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.