#javascript #vue.js #scroll #scrolltop
#javascript #vue.js #прокрутка #scrolltop
Вопрос:
Контекст: я пытаюсь добиться этого -> https://hhk6r.csb.app /
Макет:
Проблема:
Прокрутка для просмотра в элементе div не приводит к прокрутке до начала панели расширения.
Документы: https://developer.mozilla.org/ru-US/docs/Web/API/Element/scrollIntoView
Я попытался использовать опцию block: ‘start’, указанную в документах, но не смог понять, где я ошибаюсь, любые предложения были бы полезны.
Я создал codesandbox, чтобы воспроизвести проблему, это то, что я пробовал до сих пор.
Комментарии:
1. Пробовал использовать scroll-margin-top на родительском элементе (div)) всей панели расширения. codesandbox.io/s/scroll-issue-forked-4q91s?file=/src/App.vue
2. О, мой плохой, да. Этот используется в случае некоторого ванильного поведения с привязкой, подобной
href="div#my-section-1"
. Здесь, похоже, у вас есть какое-то другое поведение, попробуйте повторить прокрутку вниз с помощью JS или переключиться на привязку к href. может быть решением.
Ответ №1:
Помимо вашей текущей работы, вы могли бы правильно компенсировать все это с помощью
scroll-margin-top: 2rem;
Вся слава Джошу Комо и его хорошему твиту, который можно найти здесь: https://twitter.com/joshwcomeau/status/1332015868725891076?lang=en
Ответ №2:
Простой способ — правильно сместить верхнюю часть поля с помощью scroll-margin-top