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

Тема в разделе "HTML, CSS, XML, JavaScript", создана пользователем dimonw, 21 мар 2012.

  1. dimonw

    dimonw Гость

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

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

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

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

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

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

Поделиться этой страницей