card.forEach( (itemCard, index) => {
itemCard.addEventListener('click', (item) => {
cardPopup.classList.remove('active');
setTimeout(() => {
cardPopup.classList.add('active')
cardPopup.innerHTML = `
<div class="card__popup-close" onclick="cardPopupCloseFun()"></div>
<div class="card__popup-image">
<img src="${arrayOfCards[index].image}" alt="">
</div>
<div class="card__popup-info">
<h2 class="card__popup-name">${arrayOfCards[index].name}</h2>
<p class="card__popup-title">${arrayOfCards[index].title}</p>
</div>
`;
}, 300)
})
})
const slider = document.querySelectorAll('.gallery').forEach( slider => {
let isDown = false;
let startX;
let scrollLeft;
slider.addEventListener('mousedown', e => {
isDown = true;
slider.classList.add('active');
startX = e.pageX - slider.offsetLeft;
scrollLeft = slider.scrollLeft;
});
slider.addEventListener('mouseleave', _ => {
isDown = false;
slider.classList.remove('active');
});
slider.addEventListener('mouseup', _ => {
isDown = false;
slider.classList.remove('active');
});
slider.addEventListener('mousemove', e => {
if (!isDown) return;
e.preventDefault();
const x = e.pageX - slider.offsetLeft;
const SCROLL_SPEED = 3;
const walk = (x - startX) * SCROLL_SPEED;
slider.scrollLeft = scrollLeft - walk;
});
});
+const opacResume = debounce( () => elem.classList.remove('animate-opacity'), 500 );
window.addEventListener('scroll', function () {
- if(this.pageYOffset >= posTop) {
- } else {
elem.classList.remove('animate-opacity');
- }
+ opacResume();
}, false);
Проблемы с безопасностью
Несколько проблем с безопасностью (например: фишинг) связаны с Data URL и переходом по ним из корневого контекста документа. Чтобы избавиться от этих проблем, переход по URI, начинающихся со схемы data://, из корневого контекста документа перестал быть возможен в Firefox, начиная с версии 59 (и начиная с версии 58 в Nightly/Beta вариантах браузера). Надеемся, что остальные браузеры так же последуют этому примеру. Для дополнительной информации смотрите Blocking Top-Level Navigations to data URLs for Fi....
data.concat(
[ ...d.querySelectorAll('section > a') ].map( a => ( { link: a.getAttribute('href') } ) ),
[ ...d.querySelectorAll('section > a > div > div > div > img') ].map( i => ( { img: i.getAttribute('data-src') } ) ),
[ ...d.querySelectorAll('section > a > div > div > div > h3') ].map( h => ( { name: h.textContent } ) ),
/* и так далее */
)
это же ограничение запросов со стороны сервера (анти ддос).
https://qna.habr.com/q/1105356 вот способ.
function mktree( sub, list ) {
if( list.length === 0 ) return;
const subsub = sub[ list[ 0 ] ] = sub[ list[ 0 ] ] || {};
mktree( subsub, list.slice(1) )
}
[[
'Мелкая бытовая техника',
'Техника для дома',
'Утюги',
'Отпариватели'
],
[ 'Компьютерная и офисная техника', 'Перефирийные устройства' ],
[
'Компьютерная и офисная техника',
'Комплектующие для компьютеров',
'Память',
'Память оперативная',
'DDR4 Desktop'
]].reduce( (tree, list) => ( mktree(tree,list),tree ), {} )