Гуру CSS помогите обрезать картинку

indenger20, не заметил линк. Спасибо большое.

Получается, что скрипт теперь мне не нужен ? Или оставить на всякий пожарный?

Если всё работает без скрипта, то не нужен. Я взглянул на сайт - вроде бы в IE, FF и Опере всё работает. Так что скрипт можно выбросить, думаю. Если другие косяки не вылезут -всё сразу не предусмотришь.

Если интересно, могу пояснить, почему косячок получился. Дело в том, что по-видимому, после CTRL+F5 скрипт начинает обрабатывать картинки до окончания их загрузки, и неправильно определяет их размеры. Исправляется легко: на каждый <img> вешается событие onload="adjust(this)" , а вместо вышеприведённого скрипта будет немного по-другому

<script>
function adjust(img){
    var r,w,h,wmax,hmax;
    r=1.44;
    wmax=180;
    hmax=125;
    w=img.width;
    h=img.height;
    if(w/h<r){
      img.width=wmax;
      img.style.top=hmax/2-img.height/2+'px';
      img.style.offsetTop=img.style.top;
      img.style.offsetLeft=0;}
    else{
      img.height=hmax;
      img.style.left=wmax/2-img.width/2+'px';   
    }
}
</script>

Но повторюсь, если через чистый CSS всё работает, то лучше без скрипта.

Выпилил скрипт, изменений пока не заметил. Потестирую еще некоторое время. А то вдруг глаз замылился уже.

Спасибо ребят за помощь 🍻

Ещё раз взглянул - нифига не кроссбраузерно. В IE точно не работает.

Sitealert, методы лечения есть какие-нибудь? Проверил в 11 IE, плющит картинки (((

Попробуй вот так. На скорую руку накидал, потому что времени нет. Надеюсь разберешься. Меняй значения width и height и посмотри как меняются картинки.

Тут 2 пути: или вернуться к скрипту - второй вариант отрабатывает без сбоев, или сделать комбинацию - со скриптом для ИЭ, без скрипта - для всех остальных. Правда я не знаю, где этот object-fit работает, а где нет. Штука относительно новая, и не во всех браузерах внедрена. Не зря же полифилл изобретали.

---------- Добавлено 22.12.2016 в 10:35 ----------

anzarsh, это было бы слишком просто. :o

Первое, что пришло в голову.

А в чем подвох? Почему нет?

Неохота башку ломать, если честно. Ваш вариант - Вы и проверяйте. :) В том же IE, мне кажется, криво работает.

Не надо башку ломать из-за этого. В ie тоже нормально работает.