Немного Переделать Скрипт Фото-галереи На Jquery

  • Автор темы dimonw
  • Дата начала
D

dimonw

#1
Всем привет. Есть скрипт вот такой прикольной фото-галереи на jquery.
http://buyexclusivejewellery.com/gallery.html
В исходном коде есть комментари на русском, а также есть комментари в css.

Загрузив в скрипт несколько разных фото - больших и маленьких, вертикальных и горизонтальных, я столкнулся с неудовлетворительным качеством отображения фотографий, а именно маленькие фото растягиваются так, что начинают выглядеть, как размытое "месиво" из красок. Вертикальные фото, которые не помещаются полностью в экран юзера, скрипт отображает только наполовину или их часть, а остальную часть можно увидеть при клике на иконку лупы в правой верхней части маленькой копии фото.

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

Первый вариант состоит в том чтобы сделать так, чтобы в галерее отображались фотографии не растянутые, а со своими реальными размерами по высоте и ширине и они были спозиционированы по центру экрана юзера. Если фото не помещается во весь экран пользователя по вертикалиили или горизонтали, пропорционально уменьшать фото, как это сделано например, когда просматриваешь фото в полноэкранном режиме в ACDsee.

Второй вариант состоит в том чтобы прописать условия:
1. Если фото маленькое и по размеру меньше, скажем трети размеров экрана юзера по ширине и высоте, не растягивать его а выводить по центру экрана.
2. Если фото вертикальное и по высоте не помещается полностью в экран юзера, уменьшать его пропорционально по ширине и высоте так чтобы по высота фото равнялась высоте экрана юзера.
3. Если фото прямоугольное и больше трети размеров экрана юзера по ширине и высоте - оставить те действия, которые сейчас в скрипте, т.е. растягивать фото на весь экран.
4. Если прямоугольное фото не помещается полностью на экране юзера, пропорционально уменьшать его, так чтобы оно умещалось полность на экране юзера.

Я даже не знаю, какой из двух вариантов лучше подойдет для меня, поэтому если возможно набросайте 2 варианта решения задачи.
Текст топика получился длинный, но я думаю, люди хорошо знающие jquery и css легко решат его правкой всего нескольких строк кода.