Question

I have the next function:

function setImagesWidth(id,width) {     var images = document.getElementById(id).getElementsByTagName('img');     for(var i = 0; i < images.length;i++) {         // If the real width is bigger than width parameter             images[i].style.width=width;             //}              }        } 

I would like to set the css width attribute of all my img tags to a particular value only when the image real width is bigger than the attribute value. If it is possible, i would like a solution which does not use any particular framework.

---

images[i].offsetWidth returns 111 for an image of 109px width. Is this because 1px each side border?

Answer 1

@Sergio del Amo: Indeed, if you check out my link you’ll see that you want clientWidth instead.

@Sergio del Amo: You cannot, unfortunately, accept your own answer. But you do have an extraneous period in the ‘px’ suffix, so let’s go with this, including the clientWidth change:

// width in pixels function setImagesWidth(id, width) {     var images = document.getElementById(id).getElementsByTagName('img');     var newWidth = width + 'px';     for (var i = 0; i < images.length; ++i)     {         if (images[i].clientWidth > width)         {             images[i].style.width = newWidth;         }                            } }