персонализирано плъзгане и пускане HTML5

Опитвам се да използвам плъзгане и пускане, за да пренаредя елементи в списъка (чист javascript). Бих искал да стилизирам "призрачния елемент" по време на операцията по плъзгане. Тъй като прочетох, че няма начин как да направя това стандартно, създавам дублиран елемент (оформен както искам), позициониран точно там, където трябва да бъде оригиналният елемент по време на операция на плъзгане и позицията му се актуализира в събитието ondrag.

Проблемът е, че тъй като този дублиран елемент винаги е точно под курсора, е невъзможно да се уловят събития на dragover или dragenter на други елементи. Без значение къде в DOM е свързан "дублираният" елемент, той винаги блокира ondragover. Ако преместя дублиращия се елемент, така че да не е под курсора, той работи, но това проваля целта на безпроблемния дублиран елемент.

Има ли някакъв начин как този дублиран елемент да бъде игнориран, така че елементите, които са под него, да получат събитието ondragover вместо това? Обикновено събитието просто минава към родителя, където е свързан дублиращият се елемент.


person Miro Krajci    schedule 10.01.2015    source източник
comment
можете ли да предоставите пример за цигулка или код за това, което сте опитвали досега?   -  person scniro    schedule 10.01.2015
comment
Благодаря за отговора. Вече работи. Това беше по-скоро концептуален проблем. Разбира се, ако поставя елемент точно под курсора, той ще получи всички събития. За щастие pointer-event css решава проблема.   -  person Miro Krajci    schedule 10.01.2015


Отговори (1)


Получих работа. Изглежда, че работи (призрачният елемент не блокира събитията), ако неговият клас има:

.duplicateGhostElementClass {
  pointer-events: none;
}

Може би ще спести време на някой.

person Miro Krajci    schedule 10.01.2015