如何在粘性菜单下显示标题之外的部分或 div？

Question

我想在将菜单项悬停在粘性菜单上时显示一个部分。这样无论我在页面中的哪个位置，都应该在粘性菜单下准确看到该部分。

我尝试将部分放在标题中。但是当我在悬停时滚动时，该部分本身就像粘性菜单一样。

滚动时如何隐藏该部分？创建类似视差的效果。

//HTML
<header role="banner" class="stickyheader">//sticky
    <nav class="row main-navigation" role="navigation">
            <ul id="primary-menu">
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
            </ul>
    </nav><!-- #site-navigation -->

    <section class="hiddensection">//section to show
                    show uo when hovering menu item 3....
                    //height:500px

    </section>
</header>

Answer 1

您可以使用滚动事件并在页面滚动时将其隐藏。

window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementByClassName(".hiddensection").style.display = "none";
} else {
document.getElementByClassName(".hiddensection").style.display= "block";
}
prevScrollpos = currentScrollPos;
}