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