МастерскаяВидеоурокиСервис для сравнения двух фотографий Juxtapose JS

Сервис для сравнения двух фотографий Juxtapose JS

Представьте, что Вы побывали в каком-то городе, где не были долгое время. За этот период город изменился – появились новые здания, а на месте вашей родной школы теперь стоит во весь рост супермаркет. А каштаны и чинары вдоль дороги на знакомой аллее вырубили и расширили дорогу на пару новых полос.

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

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

Конечно же, сравнивать можно любые две фотографии – главное, сделать их с одного ракурса и размер обеих фотографий сделать одинаковыми, например, 1024х728 пикселей. Не обязательно задавать именно это разрешение, но постарайтесь, чтобы ширина ваших изображений не была меньше 800 пикселей и больше 1800-2000 пикселей. Вот, например, посмотрите на фотографию ниже – я просто взял две фотографии одной и той же машины в интернете до ремонта и после. Подвигайте ползунок и вы увидите, как изменился облик искорёженного автомобиля после работы над ним.

Вместо этого фото можно, например, сравнить фотографии людей. В том числе и самого себя – мы же тоже меняемся со временем.

А в видеоуроке ниже вы можете увидеть, что сделать такой в сервисе Juxtapose JS не представляет сложности. В видеоуроке я загружаю фотографии на свой сайт, но по этой же схеме можно загрузить свои фотографии куда угодно. Сам сервис Juxtapose JS предлагает загрузить фотографии в Dropbox (для этого сначала зарегистрируйтесь на сайте www.dropbox.com). Приятного просмотра.

Данный видеоурок создан при финансовой поддержке Института “Открытое общество” – Фонд содействия в Таджикистане.

Rustam Gulov
Rustam Gulovhttps://alifbo.media
Независимый медиа-тренер и консультант, блоггер, сооснователь первой фактчек-платформы Таджикистана Factcheck.tj и блогплатфоры Blogiston.tj. Веду данный авторский проект Alifbo.Media - образовательный ресурс о новых медийных технологиях, трендах, онлайн-сервисах для подготовки мультимедийных материалов. В свободное время читаю, веду канал на Телеграм, создаю сайты, программирую.

Вас могут заинтересовать и эти материалы

ОСТАВЬТЕ ОТВЕТ

Пожалуйста, введите ваш комментарий!
пожалуйста, введите ваше имя здесь