31 lines
1.1 KiB
Markdown
31 lines
1.1 KiB
Markdown
# Выбор фрагмента картинки мышью
|
|
|
|
[importance 3]
|
|
|
|
Реализуйте интерфейс для выбора фрагмента изображения мышью.
|
|
|
|
Нажмите на изображении и проведите мышью для выбора:
|
|
[iframe height=350 src="solution" link]
|
|
|
|
По окончании смены размеров должно быть событие `crop` c `left/top` координатами и `width/height` размерами выбранной области.
|
|
|
|
Синтаксис:
|
|
|
|
```js
|
|
var croppable = new Croppable({
|
|
elem: $('#heroes')
|
|
});
|
|
|
|
$(croppable).on("crop", function(e) {
|
|
// вывести crop-квадрат, left/top - относительно изображения
|
|
// e.left, e.top, e.width, e.height
|
|
});
|
|
```
|
|
|
|
<ul>
|
|
<li>Область можно выбирать, двигая курсором в любую сторону от исходной точки.</li>
|
|
<li>Область не может вылезать за пределы изображения.</li>
|
|
</ul>
|
|
|
|
[edit src="task" task/]
|
|
|