Pull to refresh

Кадрирование картинок с использованием JQuery

Reading time1 min
Views1.5K
Кадрирование фотографий сейчас востребовано, потому что любое сообщество подразумевает общение живых людей. А общатся с собеседником проще «зная его в лицо».

У меня были свои требования к контролу который будет производить кадрирование. Поискав идеальное готовое решение я его не нашел и решил написать свой.

Требования такие:
1. Иконки за которые надо тянуть, чтоб изменить блок, должны быть большие.
2. Часть изображения которое вырежется должна быть оригинальная, а то что образается полупрозрачно прикрыто.

Вид кадрирования

Скрипт использует библиотеку JQuery. Сам контрол сделан как плагин к JQuery.
Можете посмотреть ПРИМЕР в работе, там же подробнее о плагине.

Интерфейс плагина следующий:

// Создает в указанном блочном элементе структуру элемента управления кадрирования
$(element).CropImageCreate(src, src_width, src_height, min_width, min_height, proportion, options);

// Возвращает данные о кадрированном изображении в виде объекта {src, left, top, width, height}
$(element).CropImageGetData());

P. S. Из готовых скриптов которые я нашел на мой взгляд лучший — imgAreaSelect.
Tags:
Hubs:
Total votes 25: ↑22 and ↓3+19
Comments14

Articles