Перейти к содержимому


Пользователь месяца
ShowPrint ShowPrint 1-й за Сентябрь
Очков активности: 283 2 темы, 21 сообщение, 7 баллов репутации
Сайт: ShowPrint.ru
ТОП самых активных за этот месяц
  • Фотография Medvedoc
    #1

    Medvedoc
    Очков активности: 510 9 тем, 58 сообщений, 4 балла репутации

  • Фотография ShowPrint
    #2

    ShowPrint (ShowPrint.ru)
    Очков активности: 312 Вне конкурса за определение пользователя месяца

  • Фотография Ixman
    #3

    Ixman (o5cat.ru)
    Очков активности: 216 0 тем, 24 сообщения, 6 баллов репутации

  • Фотография BLIK
    #4

    BLIK
    Очков активности: 210 Вне конкурса за определение пользователя месяца

  • Фотография Игорь Ку
    #5

    Игорь Ку (dudesday.ru)
    Очков активности: 126 4 темы, 9 сообщений, 4 балла репутации

  • Фотография WGN
    #6

    WGN (worldgamenews.com)
    Очков активности: 88.5 Вне конкурса за определение пользователя месяца

  • Фотография Алексей111
    #7

    Алексей111 (xvideo24.ru)
    Очков активности: 66 8 тем, 20 сообщений, 1 балл репутации

  • Фотография yuran
    #8

    yuran (yurbol.ru)
    Очков активности: 37.5 1 тема, 22 сообщения, 1 балл репутации

  • Фотография Zevss
    #9

    Zevss (domles43.ru)
    Очков активности: 22.5 2 темы, 9 сообщений, 1 балл репутации

  • Фотография falka
    #10

    falka (mygoodjob.ru)
    Очков активности: 16.5 3 темы, 2 сообщения, 1 балл репутации

  • Показать весь ТОП 10

Kwork.ru - услуги фрилансеров от 500 руб.

Поддержите форум! =)
Апдейты
  • Яндекс тИЦ: 26.09.2018
  • Яндекс выдача: 20.10.2018
Топ 5 участников по репутации


Как обрезать картинку?

#1 Вячеслав

Вячеслав
  • Пользователь
  • 381 сообщений
  • Репутация: 2
0

Отправлено 14 March 2010 - 01:52

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

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

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

Вопрос как правильно масштабировать эту картинку, чтоб не искажалась и в тоже время была видна полностью, ну или большая ее часть???
Шото совсем туплю...
Всем спасибо!!!

 

 

  • 0

#2 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 14 March 2010 - 22:14

http://sexy.hohli.com/
  • 0

#3 Вячеслав

Вячеслав
    Topic Starter
  • Пользователь
  • 381 сообщений
  • Репутация: 2

Отправлено 14 March 2010 - 23:07

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

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

[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

Посмотреть тут
  • 0

#4 gaaarfild

gaaarfild
  • Неактивные
  • 596 сообщений
  • Репутация: 0

Отправлено 15 March 2010 - 20:38

Единственная информативная строка - overflow:hidden; - что имеется ввиду, то, что не влезает в формат - прячется.
  • 0

#5 ZiTosS

ZiTosS
  • Неактивные
  • 5148 сообщений
  • Репутация: 8

Отправлено 19 March 2010 - 00:22

Вячеслав, я бы всёж для этих целей написал бы серверный скрипт.
  • 0

#6 gaaarfild

gaaarfild
  • Неактивные
  • 596 сообщений
  • Репутация: 0

Отправлено 22 March 2010 - 11:24

А сделать это лучше для того, чтобы лишняя, ненужная картиночка не загружала траффик и не увеличивала время загрузки страницы.


  • 0

#7 Вячеслав

Вячеслав
    Topic Starter
  • Пользователь
  • 381 сообщений
  • Репутация: 2

Отправлено 28 March 2010 - 19:08

Единственная информативная строка - overflow:hidden;


Не понял? что значит "информативная", я же картинку центрирую margi`nom...
А что из себя представляет этот серверный скрипт? как это реализовать, если можно ссылку почитать, спасибо.
  • 0

#8 gaaarfild

gaaarfild
  • Неактивные
  • 596 сообщений
  • Репутация: 0

Отправлено 28 March 2010 - 23:58

Я к тому, что по данному вопросу ценной является только эта строка. Остальные - не относятся к решаемой проблеме. А насчет скрипта - это к библиотеке gdlib и вообще в раздел PHP или, например Perl.
  • 0

#9 yury

yury
  • Пользователь
  • 642 сообщений
  • Репутация: 188

Отправлено 29 March 2010 - 07:43

...
А что из себя представляет этот серверный скрипт? как это реализовать, если можно ссылку почитать, спасибо.

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

robot

robot
  • Пользователь PRO
  • 2652 сообщений
  • Репутация: 85


Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru