Адаптивная галерея фотостен с функцией Swipe - PullRequest
Новая
       12

Адаптивная галерея фотостен с функцией Swipe

5 голосов
/ 10 ноября 2011

Я собираюсь создать галерею javascript / jquery, которая соответствует приведенным ниже критериям, и хотел бы знать, существуют ли какие-либо модули галереи, которые имеют все / большинство из этих функций:

1. Фотостена с функцией увеличения (один вид). например. http://tympanus.net/Tutorials/SlidingPanelPhotowallGallery/

2. Адаптивный, чтобы изображения на фотостене отображались правильно для настольных и мобильных устройств, и переставляли, если пользователь изменял размер своего браузера. например. http://isotope.metafizzy.co/

3. (необязательно, но желательно). Если пользователь подключен к мобильному устройству, разрешите ему пролистывать отдельные изображения.

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

Фотографии будут получены из папки на сервере. Модераторы - это просто девушки-операторы, которые будут загружать изображения со своих цифровых камер в эту папку через ftp - они не будут изменять размер / оптимизировать изображения, поэтому было бы замечательно, если бы это могло произойти где-то в процессе.

Мы размещаемся в среде PHP / Linux.

Ответы [ 2 ]

2 голосов
/ 23 ноября 2011

Посмотрите на jQuery Mason: http://masonry.desandro.com/

Может использоваться в качестве отзывчивой стены.

То, что вы просите, не называется «зумом» (это еще один эффект), вам кажется, что то, что называется лайтбоксом. Их много, вот сравнение, http://planetozh.com/projects/lightbox-clones/

Чтобы изменить размеры изображений, вам нужно написать php, чтобы использовать image GD или imagemagick, вот учебник, http://net.tutsplus.com/tutorials/php/image-resizing-made-easy-with-php/ или, возможно, скрипт, http://shiftingpixel.com/2008/03/03/smart-image-resizer/ (или timthumb .php).

Для того, чтобы служить им, вам придется написать php с вашим javascript.

Не существует единого решения для того, что вы просите, вам придется написать это или нанять кого-нибудь для этого.

1 голос
/ 23 ноября 2011

Насколько я знаю, вам нужно создать плагин или написать собственные функции jquery для получения всех пользовательских функций (это будет очень хорошо с точки зрения производительности и обслуживания)

  1. для масштабированияФункциональность Вы можете использовать некоторые модальные окна с вызовом ajax или создать.
  2. , чтобы достичь этого, вам нужно написать хороший CSS, чтобы ваша фотография выровнялась в соответствии с screen.reshuffle, если вы напишите хороший CSS..
  3. да, вы можете добиться этого, обнаружив браузер-навигатор и изменив соответствующим образом CSS и Javascript.
  4. Для предварительной обработки изображений (изменения размера, динамического создания больших пальцев) вы можете выбрать внутренние решения php.
  5. И не беспокойтесь, вы можете обрабатывать изображения из папки через Ajax и показывать их по мере необходимости.
...