Как использовать JuxtaposeJS

В раздел Create a Juxtapose slider добавьте две фотографии: по ссылкам или из Dropbox, Flickr, Google Drive. Из двух изображений вы получаете одно, поделённое ползунком на две части.

Berliner Morgenpost использовало JuxtaposeJS, чтобы сравнить Берлин 1945 года и современную столицу Германии

Установите настройки — они абсолютно исчерпывающие:

• Стартовая позиция слайдера
• Лейблы
• Подписи
• Анимация ползунка
• Масштаб изображения
• Вертикальный или горизонтальный слайдер

Готовый слайдер можно встраивать через iFrame или на Medium с помощью специально адаптированной ссылки.

Как сделать фотослайдер «до и после» с помощью сервиса Juxtapose

В результате получается наглядная иллюстрация изменений: пользователю не нужно переводить взгляд с одной фотографии не другую. Большое преимущество JuxtaposeJS — его простота. Пользователь выбирает минимальное количество параметров, а значит, риск сделать что-то не то сводится к нулю. Кроме того, для использования инструмента не нужно уметь кодить. Наконец, этот инструмент работает на всех платформах и девайсах, что делает его универсальным.

Чем Juxtapose лучше других подобных инструментов?

В отличие от TwentyTwenty JuxtaposeJS не нужно скачивать и преобразовывать под него свой код.

От Jquery Sequence его отличает большее разнообразие: в Sequence полоска слайдера может располагаться только горизонтально и делить картинку пополам, а в Juxtapose можно выбрать несколько вариантов в настройках.

Кроме того, Juxtapose удобнее использовать, чем Before After Image Slider: последний работает только в комплекте с фреймворком Vafpress: для корректной работы придется скачивать и Before After, и этот фреймворк.

Инструкция актуальна на октябрь 2017 года.