Как в JavaScript сделать перетаскивание объекта в iframe, чтобы перетаскивание не завершалось, когда курсор выходит за рамку ifram'a?

Question

[BorodinKO]

необходимо сделать так, как это сделано в google maps, когда при перетаскивании карты курсор выходит за границу ifram'a, перетаскивание не завершается.
Я делаю это с помощью .onmousedown, .onmousemove, .onmouseup. они не срабатывают когда курсор выходит за границу.
Как реализуют такое перетаскивание?

Comments

[Руслан Лопатин]

А где вы там iframe увидели?

[BorodinKO]

Если карту вставлять на страницу так:

<iframe src="https://www.google.com/maps/embed?pb=!1m5!3m3!1m2!1s0x0%3A0x0!2zKzU1wrA0Nic1MC41MiIsICszN8KwMjknMzcuNjgi!5e0!3m2!1sru!2sru!4v1389588925012" width="600" height="450" frameborder="0" style="border:0"></iframe>

Answer 1

[Руслан Лопатин]

Наверное, там всё же используется drag-n-drop events. Ссылка в тему: www.useragentman.com/blog/2010/01/10/cross-browser...

Answer 2

[BuranLcme]

Скорее всего никак. IFrame - это абсолютно другой DOM. Судя по описанию вы пытаетесь элемент из его DOM перетащить в другой DOM. В случае DnD API, скорее всего, стоит ограничение на уровне спецификации. До появления DnD API это делалось добавлением элементу абсолютного позиционирования и смену ему координат. В такой реализации элемент не может выйти за пределы своего body. Если очень хочется, вы можете ловить момент когда приблизились к краю, скрывать оригинальный элемент во фрейме и создавать его копию вне фрейма. Но я бы на вашем месте сначала задумался действительно ли это все нужно.