Question

我有菜单，当用户向下滚动时，它应该固定位置，z-index位于页面顶部。但就我而言，我设置了绝对位置和z-index，但显示了菜单下方的文字。如何在此文本上制作菜单？

我的代码是：

 $(window).scroll(function () {
        var scroll = $(window).scrollTop();
        if (scroll > 0) {
            $(".nav-primary").addClass("scrolled");
        }
        else {
            $(".nav-primary").removeClass("scrolled");
        }
    });

 #theme-wrapper-inner {
    background-color: #fff;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
    margin: 0 auto;
    width:1240px;

}

.scrolled {
    animation: 650ms ease 0s normal none 1 running move-menu-down;
    margin-left: 0;
    margin-right: 0;
    position: fixed;
    top: 0;
    width: 1240px;
    z-index: 9999;
}

<body>
<div id="theme-wrapper">
    <div id="theme-wrapper-inner">
        <header id="header">
            <div class="row">
                <div class="large-12">
                    <div class="site-id mobile-four clearfix">
                         <div class="site-title-wrapper"><h1 class="site-title">My Site</h1></div>
                      </div>
                </div>
            </div>
          
          <div class="navigation">
                <div class="row" style=" ">
                    <div class="large-12">
                        <nav class="nav-primary" role="navigation">
                            <div id="menu">
                               
                                <ul class="nav-primary">
                                  <li>Home</li>
                                  <li>About us</li>
                                  <li>Contact us</li>
                                </ul>

                                
                            </div>
                        </nav>

                    </div>
                </div>
            </div>

z-index和position：绝对问题

0 个答案: