# Highlight the Menu Link of the Section in View

> Marks the menu link that points to the section currently on screen (for one-page sites with #about, #services links), updating as visitors scroll.

- Type: HTML
- Runs: Site-wide footer
- Category: [Frontend & Design](https://wpide.com/library/category/frontend/)
- Tags: navigation, one-page, scroll
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/frontend-scrollspy-menu/

## Code

```html
<style>
a.is-current{font-weight:700;text-decoration:underline;text-underline-offset:.3em;}
</style>
<script>
(function () {
    if (!('IntersectionObserver' in window)) { return; }
    var links = Array.prototype.filter.call(document.querySelectorAll('nav a[href*="#"]'), function (a) {
        return a.hash.length > 1 && a.pathname === window.location.pathname && document.getElementById(decodeURIComponent(a.hash.slice(1)));
    });
    if (!links.length) { return; }
    var byId = {};
    links.forEach(function (a) { var id = decodeURIComponent(a.hash.slice(1)); (byId[id] = byId[id] || []).push(a); });
    var io = new IntersectionObserver(function (entries) {
        entries.forEach(function (entry) {
            if (!entry.isIntersecting) { return; }
            links.forEach(function (a) { a.classList.remove('is-current'); a.removeAttribute('aria-current'); });
            (byId[entry.target.id] || []).forEach(function (a) { a.classList.add('is-current'); a.setAttribute('aria-current', 'location'); });
        });
    }, { rootMargin: '-45% 0px -50% 0px' });
    Object.keys(byId).forEach(function (id) { io.observe(document.getElementById(id)); });
})();
</script>
```

## Notes

Give each section an HTML anchor (Advanced > HTML anchor) matching the menu links. The active link gets the class is-current and aria-current.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Highlight the Menu Link of the Section in View" in its snippet library and add it in one click; or create a new HTML snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/