Автоматическая обрезка изображений

[Wania]

Приветствую! Нужна помощь в следующем:

- Имеем верстку в которой все картинки должны быть с одинаковой высотой и шириной. (для картинок задан width и height)

- При загрузке некоторые фото непропорционально растягиваются, что не есть хорошо.

Как сделать так, чтобы фото уменьшалось по заданным размерам и, если это требуется, часть картинки обрезалась?

[Great Rash]

Задавать надо только один параметр - либо ширину, либо высоту - тогда изображение будет растягиваться/сужаться пропорционально. Плюс родителю overflow: hidden; чтобы изображение обрезалось.

[wildhind]

тут бы ещё пару строк скриптика, который бы определял, по какой стороне масштабировать — по ширине или по высоте, и в случае необхидимости обрезки давал верхний или левый отрицательный маргин, чтоб центрировалось.

[Great Rash]

и в случае необхидимости обрезки давал верхний или левый отрицательный маргин, чтоб центрировалось.

Зачем центрировать? Вдруг у меня на фотке вся полезная инфа слева сверху?

jQuery

$(function() {
  $('img').load(function() {
    var $this = $(this);

    if (this.width > this.height) $this.addClass('bigger-width');
    if (this.width < this.height) $this.addClass('bigger-height');
  });
});

CSS

.bigger-width {min-width: 200px;}
.bigger-height {min-height: 200px;}

Что-то типа того.

[Wania]

Разобрался, спасибо