Как в js сделать ссылку верхнего блока не кликабельной при fixed со скроллингом?

Question

У меня есть рабочий джаваскрипт, реализующий наезд на верхний блок. Он с fixed. При скроллинге контента, блок плавно исчезает. Однако, в блоке есть ссылки, которые остаются кликабельными. В результате, случайный клик по исчезновшему блоку, приводит к переходам по его ссылкам. Возможно ли сделать их не кликабельными в начале процесса скроллинга?

Скрипт:

  var elements = document.getElementsByClassName(className);
  Array.from(elements).forEach(function(element) {
    window.addEventListener('scroll', function() {
      var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
      var opacity = 1 - (scrollTop / element.offsetHeight);
      opacity = Math.max(0, Math.min(1, opacity));
      element.style.opacity = opacity.toString();
      if (scrollTop >= scrollThreshold) {
        element.style.opacity = '0';
      }
    });
  });
}
setOpacityOnScroll('aetitisy-site-header', 200);

Спасибо!

Answer 1

Выбирай:

```
visibility: hidden
```
```
pointer-events: none
```
```
display: none
```
```
opacity: 0
```

Но учитывая что 4й пункт в коде уже есть, ты делаешь не то, что пишешь, поэтому тебе поможет только второй пункт, но пользователи тебя проклянут за нерабочие полувидимые ссылки.

Получается, реализовать отключение ссылок при старте скроллинга — невозможно?

Ну я ж сказал - второй пункт списка:

window.addEventListener('scroll', function () {
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop
  element.style.opacity = Math.max(0, 1 - scrollTop / element.offsetHeight)
  element.style.pointerEvents = scrollTop < 3 ? 'all' : 'none'
})

БЛОГ НА HUSL

Как в js сделать ссылку верхнего блока не кликабельной при fixed со скроллингом?

Ответы (1 шт):