вопрос
На сайте в коротких новостях используются маленькие картинки, поэтому они довольно легко подходят и для вывода в качестве картинок в похожие новости (и topnews)
Код такой:
Всё хорошо, но вот если картинка имеет сильную разницу в соотношении сторон например 50x100px или 100x50px выглядит такая картинка ужасающе)))
опять же, если задавать только высоту или ширину то эти же картинки выглядят так же не оч привлекательно.
Как же сделать так, чтоб все картинки были пропорционально обрезаны, если они имеют резмер, больше заданного?
Код такой:
Всё хорошо, но вот если картинка имеет сильную разницу в соотношении сторон например 50x100px или 100x50px выглядит такая картинка ужасающе)))
опять же, если задавать только высоту или ширину то эти же картинки выглядят так же не оч привлекательно.
Как же сделать так, чтоб все картинки были пропорционально обрезаны, если они имеют резмер, больше заданного?
из CSS удаляем
А в js пишем:
Этот скрипт вычисляет высоту и ширину картинки и если ширина больше высоты, то ограничивает ширину, если нет - ограничивает высоту.
Так же если картинки в новости нет - он просто спрячет блок с картинкой с глаз долой)))
Минусы:
- Нет проверки, если размер одной из сторон меньше 50px;
- Скрипт начинает работать , когда загружены все картинки (иначе в некоторых случаях некорректно происходит обработка в Opera и Chrome старых версий)
.relatednews ul li .f_left img {
max-width: 50px;
max-height: 50px;
}А в js пишем:
$(function () {
$(window).load(function() {
$(".relatednews img").each(function () {
relImg = $(this).attr("src");
relImgH = $(this).attr("height");
relImgW = $(this).attr("width");
if(relImg == ""){
$(this).parent().hide(1000);
}
if(relImgH > relImgW) {
$(this).attr("width","50");
} else {
$(this).attr("height","50");
}
});
});
});Этот скрипт вычисляет высоту и ширину картинки и если ширина больше высоты, то ограничивает ширину, если нет - ограничивает высоту.
Так же если картинки в новости нет - он просто спрячет блок с картинкой с глаз долой)))
Минусы:
- Нет проверки, если размер одной из сторон меньше 50px;
- Скрипт начинает работать , когда загружены все картинки (иначе в некоторых случаях некорректно происходит обработка в Opera и Chrome старых версий)
