Авто размер всех картинок на странице
 

Можно ли сделать так чтобы все картинки внутри тэга img автоматический изменяли свой размер до нужного, если они большего него.

Решение на коленке с помощью jquery:

$(function(){
$('img').live('load',function(){
  needWidth = 200;
  needHeight = 200;
  obj = $(this);
  imageOrientation = ((obj.height()>obj.width())?'vertical':'horizontal');
  if (imageOrientation == 'vertical')
     if (obj.height()>needHeight) obj.css('height',needHeight);
  else
     if (obj.width()>needWidth) obj.css('width',needWidth);
});
});

Мне кажется я что то не так делаю. Если не трудно, не могли бы вы сделать простой пример. Просто я нуб.

У нас нет ни исходных данных... Ни нормального описания/иллюстрации того, что тебе нужно получить в итоге...

function fitSize(image, h, w) {
	var nh = image.offsetHeight,
	nw = image.offsetWidth;
	image.style.height = (h > w ? h : nh * ( w / nw )) + "px";
	image.style.width = (h > w ? nw * ( h / nh ) : w) + "px";
}

Уменьшает (а может и увеличивать) размеры изображения, сохраняя пропорции.

Пример использования:

<img src='image.png' id='foo' />
<script type='text/javascript'>
	fitSize(document.getElementById("foo"), 100, 150);
	/*
		foo — ID нужного изображения
		100 — нужная высота
		150 — нужная ширина
	*/
</script>

спасибо откликнувшимся, но пока ничё не получается
залил сайт на скорую руку http://art-aggr.appspot.com/
контент заполняется питоном
вобщем злые картинки упрямятся и не хотят помещаться в колонку

для начала каждой картинке присвой class

<img src="" class="oneSizeImages">

imgW=100 // требуемая единая ширина картинок
imgH=100  // требуемая единая высота картинок

window.onload=function(){
var IMAGES=document.getElementsByClassName('oneSizeImages') // находим все картинки для которых нужно изменить размеры
for (var i=0; i<IMAGES.length; i++){
IMAGES[i].style.width=imgW+"px"
IMAGES[i].style.height=imgH+"px"
}
}

вот вроде и все
а если нужно привести например к одной ширине сохраняя пропорции то

imgW=100 // требуемая единая ширина картинок


window.onload=function(){
var IMAGES=document.getElementsByClassName('oneSizeImages') // находим все картинки для которых нужно изменить размеры
var w,h
for (var i=0; i<IMAGES.length; i++){
var w=IMAGES[i].offsetWidth
var h=IMAGES[i].offsetHeight
var o=imgW/w
var imgH=h*o
IMAGES[i].style.width=imgW+"px"
IMAGES[i].style.height=imgH+"px"
}
}

Проверил, небыли поставлены скобки

$(function(){
$('img').live('load',function(){
  needWidth = 200;
  needHeight = 200;
  obj = $(this);
  imageOrientation = ((obj.height()>obj.width())?'vertical':'horizontal');
  if (imageOrientation == 'vertical')
    {
      if (obj.height()>needHeight) obj.css('height',needHeight);
    }
  else
     if (obj.width()>needWidth) obj.css('width',needWidth);
});
});

Так работает. Скрипт можно запихнуть в любое место, картинки будут ресайзиться сразу после загрузки. В место img можно указать более подробный селектор.

2 kadabrik
блин не работает скрипт у меня, видимо у меня руки не оттуда растут(
и глупый вопрос, кроме того чтобы вставить скрипт, ничего больше делать не надо?
2 bushstas
а ваш скрипт работает, но вот в чём проблема, контент заполняется автоматически и присвоить класс всем картинкам не получится, а если использовать класс от колонки, то ничего не выравнивается. Может есть какой-нибудь способ автоматически назначит всем картинкам класс или типа того. Я уже и не знаю что придумать.

ещё раз спасибо всем.

a что там за "автомат"? и почему он не может присвоить им класс??
я не знаю ничего о "питоне", что это? python? и чем он отличается принципиально от php?
тогда нужно найти параметр например src в котором у них есть чтото общее у всех, например в src они загружаются из одной папки, просто если брать их все по имени тега, так ведь на сайте еще много всяких картинок
хотя нет, нужно знать id родителя где они все распологаются
тогда можео будет и по имени тега
просто нужно понять каким образом наполняется контент