#javascript #events #event-handling #zurb-foundation
#javascript #Мероприятия #обработка событий #zurb-foundation
Вопрос:
Как перехватить стороннее JS-событие, чтобы изменить его действие?
В моем примере я установил на своем веб-сайте полосу стикеров с помощью foundation.
<div data-sticky="xrwv5y-sticky" class="toc-desktop toc toc-tree sticky is-anchored is-at-top" data-top-anchor="main:top" data-btm-anchor="main:bottom" data-resize="49dgxp-sticky" data-mutate="49dgxp-sticky" style="max-width: 288.567px; margin-top: 0px; bottom: auto; top: 0px;" data-events="mutate"><h2 class="heading">Sommaire</h2><ol class="circle">...
При прокрутке вниз JS из foundation применяет другую верхнюю границу к застрявшему классу
<div data-sticky="xrwv5y-sticky" class="toc-desktop toc toc-tree sticky is-at-top is-stuck" data-top-anchor="main:top" data-btm-anchor="main:bottom" data-resize="49dgxp-sticky" data-mutate="49dgxp-sticky" style="max-width: 288.567px; margin-top: 1em; bottom: auto; top: 0px;" data-events="mutate"><h2 class="heading">Sommaire</h2><ol class="circle"><li><a href="#pararaph-header-730">
Я хотел бы изменить это поведение, чтобы добавить немного пикселей к верхней части поля в зависимости от того, отображается ли верхняя панель администратора или нет
Комментарии:
1. Вы можете попытаться переопределить базовые стили, используя тот же класс. Но для более общего понимания, можете ли вы поделиться практическим примером?
2. это практический пример . foundation/sites/docs/sticky.html . если вы посмотрите на класс sticky изображения млечного пути, вы увидите, что при прокрутке в JS применяется верхняя граница поля. В пользовательском файле JS я хотел бы перехватить это событие и проверить его, чтобы изменить максимальное значение поля
3. вы пытались использовать свойство data-margin-top? codepen.io/ZURBFoundation/pen/GmGbjK