X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Как обрезать картинку?
toorr2p
toorr2p
Topic Starter сообщение 14.3.2010, 2:52; Ответить: toorr2p
Сообщение #1


Привет друзья!!! :P

Блин столкнулся с такой ситуацией, на сайте в постах используеться превьюшка которая выводиться на главной - http://www.funkyduck.ru/index.php, и эта же превьюшка используеться в модулях, но там размер превью должен быть строго 100x100px, и если тупо масштабировать картинку под этот размер, будет искажение картинки т.к она имеет не пропорциональные размеры ширины и высоты.

Я посткпил так - картинка выводиться обычным размером, но заключена в теги <li><a><img></a></li> у которых фиксированная ширина и высота в 100px и owerflow:hidden; Тоесть отображаеться как видите - http://www.funkyduck.ru/index.php/ru/cases.../portfolio.html только левый верхний угол изображения.

Вопрос как правильно масштабировать эту картинку, чтоб не искажалась и в тоже время была видна полностью, ну или большая ее часть???
Шото совсем туплю...
Всем спасибо!!!
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sc2r2bey
sc2r2bey
сообщение 14.3.2010, 23:14; Ответить: sc2r2bey
Сообщение #2


http://sexy.hohli.com/


--------------------
Заметки о разработке и не только
программирую web и для we


Поблагодарили: (0)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
toorr2p
toorr2p
Topic Starter сообщение 15.3.2010, 0:07; Ответить: toorr2p
Сообщение #3


Спасибо за плагин!
Но здесь немного другое требовалось...

Вобщим решил пока сделать таким образом:

[code]
<li>
<a><img/></a>
</li>


li, a{
float:left;
height:100px;
margin:0 !important;
overflow:hidden;
padding:0 !important;
width:100px;
}
li a img{
margin-left:-20px;
width:160px;
}


Это при том то разрешение картинки 232x150px, тоесть ее никак нельзя сжать по ширене до 100px, потому то тогда по высоте она не будет 100px.
поэтому ужимаем до 160px при которых высота становитьс уть больше 100px (тоесть область ссылки заполняеться до низа, что и требовалось) и смещаем картинку на 20px в лево, дабы приблизиться к центру картинки (тоесть будет видна ее центральная часть, а не левая верхняя область как раньше).

Ну вот только такая мысля в голову пришла, если есть какие более эффективные, подскажите буду оч благодарен :P

Посмотреть тут
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
gaaarfild
gaaarfild
сообщение 15.3.2010, 21:38; Ответить: gaaarfild
Сообщение #4


Единственная информативная строка - overflow:hidden; - что имеется ввиду, то, что не влезает в формат - прячется.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 19.3.2010, 1:22; Ответить: ZiTosS
Сообщение #5


Вячеслав, я бы всёж для этих целей написал бы серверный скрипт.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
gaaarfild
gaaarfild
сообщение 22.3.2010, 12:24; Ответить: gaaarfild
Сообщение #6


А сделать это лучше для того, чтобы лишняя, ненужная картиночка не загружала траффик и не увеличивала время загрузки страницы.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
toorr2p
toorr2p
Topic Starter сообщение 28.3.2010, 20:08; Ответить: toorr2p
Сообщение #7


(gaaarfild @ 15.3.2010, 20:38) *
Единственная информативная строка - overflow:hidden;


Не понял? что значит "информативная", я же картинку центрирую margi`nom...
А что из себя представляет этот серверный скрипт? как это реализовать, если можно ссылку почитать, спасибо.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
gaaarfild
gaaarfild
сообщение 29.3.2010, 0:58; Ответить: gaaarfild
Сообщение #8


Я к тому, что по данному вопросу ценной является только эта строка. Остальные - не относятся к решаемой проблеме. А насчет скрипта - это к библиотеке gdlib и вообще в раздел PHP или, например Perl.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
yury_mw
yury_mw
сообщение 29.3.2010, 8:43; Ответить: yury_mw
Сообщение #9


(Вячеслав @ 28.3.2010, 20:08) *
...
А что из себя представляет этот серверный скрипт? как это реализовать, если можно ссылку почитать, спасибо.

Вячеслав,
посмотрите этот скрипт про вырезку из изображения произвольной и центральной областей
и этот про уменьшенную копию изображения

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Большие ставки для кликов в Я.Директ. Как удешевить?
2 rownong27 1124 26.3.2024, 14:13
автор: knezevolk
Открытая тема (нет новых ответов) Как вы бросили работу и перешли на заработок с сайтов?
12 uahomka 2298 25.3.2024, 6:52
автор: Skyworker
Открытая тема (нет новых ответов) Как отозвать банковский платеж фрилансеру?
28 metvekot 3921 25.3.2024, 6:34
автор: Skyworker
Открытая тема (нет новых ответов) Как вывести деньги в Украине с заблокированного Юмани ?
23 freeax 3647 24.3.2024, 20:55
автор: Liudmila
Открытая тема (нет новых ответов) Через какой браузер и как можно найти в кэшэ браузера видео
10 Room 1943 23.3.2024, 7:41
автор: Room


 



RSS Текстовая версия Сейчас: 29.3.2024, 14:02
Дизайн