Как в событии touchmove получать target над которым в данный момент происходит событие
Как мне получать event.target над которым сейчас находиться палец. В мозилле есть explicitOriginalTarget, то и есть нужен динамический таргет. И вторая проблема что при использовании explicitOriginalTarget в первый цикл тач все работает как и должно, но вот дальше как и с обычным таргет. В общем смысл в том, что при touchmove на элементе, следить за тем над каким дочерним элементом он сейчас. Или может есть какие-нибудь другие способы?
let imgs;
let cardActivated = [];
const cardItems = document.querySelectorAll('.productTest__item');
cardItems.forEach(item => {
item.addEventListener('mouseenter', getInnerItems);
item.addEventListener('touchstart', getInnerItems);
item.addEventListener('touchmove', function(e) {
let wrapper = e.currentTarget.lastElementChild;
imgs.forEach((img, index) => {
img.classList.remove('active');
wrapper.children[index].classList.remove('active')
})
console.log(e.target)
e.target.classList.add('active')
imgs[e.target.dataset.id].classList.add('active')
})
item.querySelector('img').classList.add('active')
})
function getInnerItems(e) {
let target = e.currentTarget;
imgs = target.querySelectorAll('img');
if (!cardActivated.includes(target)) {
cardActivated.push(target);
let maskArea = document.createElement('div');
let itemWidth = target.offsetWidth;
maskArea.classList.add('productTest__mask');
maskArea.addEventListener('mouseleave', maskLeave);
target.append(maskArea);
imgs.forEach((img, index) => {
let mask = document.createElement('div');
mask.classList.add('productTest__mask-item');
mask.style.width = itemWidth / imgs.length + 'px';
mask.setAttribute('data-id', index)
mask.addEventListener('mouseenter', changeActiveSlide)
mask.addEventListener('mouseleave', changeLeave);
maskArea.append(mask);
})
}
}