In this tutorial, I’ll show you how to build anchor links so that your header doesn’t cover the text you’re scrolling to. In this example, I’ll build a table of contents for a blog post.
Article: https://www.will-myers.com/articles/p...
Timestamps
0:38 - Creating Anchor Links
4:52 - Smooth Scroll Anchor Links
5:35 - Anchor Links without Text
6:54 - Fixing the Header Overlap Problem
The Issue
Anchor links will often overlap the content we want to be visible with our header.
The Solution
The solution here is actually quite simple. Using the scroll-margin property, we can offset where the anchor links scrolls too! However, we need to target the anchor that we’re scrolling too.
Newsletter: https://www.will-myers.com/newsletter
Buy Me A Coffee: https://www.buymeacoffee.com/willmyers
Plugin Store: https://www.will-myers.com/products
Смотрите видео Perfect Anchor Links in Squarespace (No Header Overlapping) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Will Myers 10 Август 2022, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 6,187 раз и оно понравилось 169 людям.