Для того, чтобы сделать ссылку верхнего блока не кликабельной при наличии fixed позиционирования и скроллинге на странице, можно использовать следующий подход на JavaScript.
- Необходимо добавить обработчик события
scroll
для отслеживания события прокрутки страницы. - В обработчике события
scroll
необходимо проверить, находится ли верхний блок в fixed позиции и если да, то добавить класс или атрибут, который предотвратит кликабельность ссылки. - Также нужно учесть случай, когда пользователь прокручивает страницу обратно вверх, чтобы ссылка стала снова кликабельной.
Пример решения на JavaScript:
// Получаем ссылку на верхний блок const topBlock = document.getElementById('topBlock'); // Добавляем обработчик события scroll window.addEventListener('scroll', function() { const scrolled = window.pageYOffset; // Проверяем, находимся ли мы в зоне верхнего блока if (scrolled >= topBlock.offsetTop && topBlock.style.position === 'fixed') { topBlock.classList.add('unclickable'); // Добавляем класс для предотвращения кликов } else { topBlock.classList.remove('unclickable'); // Удаляем класс, если верхний блок не в зоне фиксации } });
CSS для класса unclickable
(для примера):
.unclickable { pointer-events: none; /* Отключаем события мыши, включая клики */ cursor: default; /* Изменяем вид курсора на стандартный */ }
Таким образом, при прокрутке страницы и фиксации верхнего блока, ссылка в нем станет неактивной для кликов, а при возвращении на обычный режим - снова будет кликабельной.