Обрезание картинки по высоте

#1 18 апреля 2013 в 19:49
Здравствуйте. Запрос в поиске ответа не дал, поэтому пишу сюда.
При публикации статей, на главную страницу выносится картинка-анонасанонс(будем её так называть).
Как сделать, чтобы при добавлении статьи эту картинку-анонс(уменьшенную копию загружаемой картинки) сжимало по ширине и обрезал по высоте, если она выше чем нужно.
Мне нужно чтобы все картинки в анонсах были одного размера и сохраняли пропорции.
Может кто помочь решить эту проблему?
#2 18 апреля 2013 в 21:26
Феникс, пока не нашли ответа можете заключить картинку в div и задать ему фиксированую ширину и длину с настройкой: overflow:hidden; Изображение внутри прижимаете к левому краю и верху. И всё, вывод будет нормальным.
#3 18 апреля 2013 в 21:30
Всё есть в настройках компонента
#4 18 апреля 2013 в 21:45


Феникс, пока не нашли ответа можете заключить картинку в div и задать ему фиксированую ширину и длину с настройкой: overflow:hidden; Изображение внутри прижимаете к левому краю и верху. И всё, вывод будет нормальным.

Azura
Да я так и хотел сделать, но дело в том, что когда я картинку обрезаю html'ом, то внизу края нельзя округлить.
А мне нужна картинка с круглыми краями.
#5 18 апреля 2013 в 21:47


Всё есть в настройках компонента

Василёк
Там можно задать ширину, а высоту оно подстраивает под пропорции картинки. При этом высота у всех картинок разная.
#6 18 апреля 2013 в 22:02
Феникс, div у прописываете border-radius:4px; или 5
#7 18 апреля 2013 в 22:36

При этом высота у всех картинок разная.

Azura
Тогда можно вот так:

<div class="image_content">
<img src="/images/...." border="0">
</div>

Для класса "image_content" нужно прописать вот такие стили:

.image_content {
float: left;
clear: none;
width: 106px;
height: 106px;
margin-bottom: 1px;
margin-right: 5px;
}
.image_content img {
display: block;
width: 100px;
height: 100px;
padding: 2px;
border: solid 1px #ccc;
}
#8 18 апреля 2013 в 23:24


При этом высота у всех картинок разная.

Azura
Тогда можно вот так:





Для класса "image_content" нужно прописать вот такие стили:

.image_content {
float: left;
clear: none;
width: 106px;
height: 106px;
margin-bottom: 1px;
margin-right: 5px;
}
.image_content img {
display: block;
width: 100px;
height: 100px;
padding: 2px;
border: solid 1px #ccc;
}

Василёк
Так пропорции же не сохраняются. Мне нужно чтобы параметры у всех были одинаковые и пропорции картинки сохранялись.


Феникс, div у прописываете border-radius:4px; или 5

Azura
Действительно работает. Спасибо! :)

Но тему закрывать не буду. Может всё таки кто-то сможет решить эту проблему через PHP.
#9 19 апреля 2013 в 00:58
Феникс, Незачто)))
#10 19 апреля 2013 в 17:11

Там можно задать ширину, а высоту оно подстраивает под пропорции картинки. При этом высота у всех картинок разная.

Феникс
В настройках есть ещё пунктик "Квадратные", вото его и нужно установить на "да".

Но тему закрывать не буду. Может всё таки кто-то сможет решить эту проблему через PHP.

Феникс
Нужно копать файл /includes/graphic.inc.php, конкретно функцию img_resize(). Функция небольшая, всего в 80 строчек кода. Но чтобы разобраться поллитра, думаю, не хватит laugh
#11 19 апреля 2013 в 21:18


Там можно задать ширину, а высоту оно подстраивает под пропорции картинки. При этом высота у всех картинок разная.

Феникс
В настройках есть ещё пунктик "Квадратные", вото его и нужно установить на "да".

Но тему закрывать не буду. Может всё таки кто-то сможет решить эту проблему через PHP.

Феникс
Нужно копать файл /includes/graphic.inc.php, конкретно функцию img_resize(). Функция небольшая, всего в 80 строчек кода. Но чтобы разобраться поллитра, думаю, не хватит laugh

Марат
Мне нужны прямоугольные картинки.
На выходных посижу в этой функции, на трезвую голову. Пойду против системы.
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.