Как изменить положение элемента на enddrag? - PullRequest
Новая
       48

Как изменить положение элемента на enddrag?

0 голосов
/ 01 июня 2018

Мне было интересно, как вы могли бы использовать слушатель события 'enddrop', чтобы изменить положение элемента.

Я пытался использовать это:

document.addEventListener('dragend', e => { e.target.style.left = e.clientX; e.target.style.top = e.clientY; });

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

Спасибо!

1 Ответ

0 голосов
/ 08 июня 2018

Я недавно решил похожую проблему:

перейдите по ссылке: Предотвратить событие удаления, когда у него уже есть дочерний элемент?Перетаскивание

в момент, когда вы начинаете перетаскивание (dragstart), вы рассчитываете верхнее и левое смещение на основе элемента и положения мыши, а в случае события окончания (перетаскивания) вы используете это смещение для адаптациипри необходимости. 

let offset = [0, 0] // initial state offset x, y
function dragStart(ev) {
    // your code..
    offsetX = ev.target.offsetLeft - ev.clientX
        ev.target.offsetLeft - ev.clientX,
        ev.target.offsetTop - ev.clientY
    ]
}

Любое сомнение поставьте код, которым я могу вам помочь.

Надеюсь, это поможет.

...