jquery - Slicknav 菜单的定位

Question

我想将我的 Slicknav 菜单按钮居中对齐，但我一直想不出怎么做。我花了几天时间编辑 CSS 无济于事。我也不希望它固定在页面顶部(我想在其上方放置一个带有社交媒体按钮的 div)，但是每当我将 prependTo 属性编辑为除“正文”之外的任何内容时，整个菜单都会消失。

<div id="nav-wrapper">
<div id="nav">
    <ul id="menu">
        <li class="main"><a href="#" class="nav">Home</a></li>
        <li class="main"><a href="#" class="nav">News</a></li>
        <li class="main"><a href="#" class="nav">Books</a></li>
        <li class="main"><a href="#" class="nav">Bio</a></li>
        <li class="main"><a href="#" class="nav">Extras</a></li>
        <li class="main"><a href="#" class="nav">Contact</a></li>
    </ul>
</div>
</div>


#nav-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0;
    margin: 0 auto;
}
#nav {
    width: 300px;
    margin: 0 auto;
    position: relative;
}

<script>
    $(function(){
        $('#menu').slicknav({
        label:'MENU',
        prependTo:'nav-wrapper',
        closeOnClick:'true' // Close menu when a link is clicked.
});
});
</script>

Answer 1

我发现了问题。我没有在 prependTo 行中的 div ID 之前放置井号。这有效:

<script>
    $(function(){
        $('#menu').slicknav({
        label:'MENU',
        prependTo:'#nav-wrapper',
        closeOnClick:'true' // Close menu when a link is clicked.
});
});
</script>