javascript - 全页js菜单不会隐藏在首页

Question

首先，我对网页设计总体来说还很陌生，所以我希望我的问题不太愚蠢。我正在使用全页 js 构建一个网站，并且几乎完成了各个部分和总体布局。现在我希望右侧的固定菜单显示在除第一个页面之外的所有页面上。我搜索了这个问题并找到了答案，但它对我不起作用。这是我的菜单:

<ul id="menu">
    <li data-menuanchor="Home" class="active"><a href="#Home">Home</a></li>
    <li data-menuanchor="About"><a href="#About">About</a></li>
    <li data-menuanchor="Classes"><a href="#Classes">Classes</a></li>
    <li data-menuanchor="pgClasses"><a href="#pgClasses">pgClasses</a></li>
    <li data-menuanchor="Contact"><a href="#Contact">Contact</a></li>
</ul>

它位于 body 标记内，但位于 #fullpage 之外。

这是我的 js 文件，其中包含我找到的函数:

$(document).ready(function() {
    "use strict";

    $('#fullpage').fullpage({
        verticalCentered: true,
        scrollingSpeed: 1200,
        css3: true,
        afterLoad: function(anchorLink, index) {
            if (index > 1) {
                $("#menu").fadeTo("slow", 1);
            }
        },
        onLeave: function(index, nextIndex, direction) {
            if (index === 2 && direction === 'up') {
                $("#menu").fadeTo("slow", 0);
            }
        }
    });
}); 

感谢您提前提供的帮助。

更新:我只是尝试在我的代码中包含一个标题菜单，该菜单应该只从第 2 部分开始显示。我用过这个

<header><ul id="topmenu">
    <li data-menuanchor="Home"><a href="#Home">Home</a></li>
    <li data-menuanchor="About"><a href="#About">About</a></li>
    <li data-menuanchor="Classes"><a href="#Classes">Classes</a></li>
    <li data-menuanchor="pgClasses"><a href="#pgClasses">pgClasses</a></li>
    <li data-menuanchor="Contact"><a href="#Contact">Contact</a></li>
    </ul></header>

在 js 文件中:

$(document).ready(function() {
"use strict";  
$('#fullpage').fullpage({
verticalCentered: true,
scrollingSpeed: 1200,
css3: true,
afterLoad: function(anchorLink, index){
    if (index === 1) {
        $("header").fadeTo("fast",0);
    }
if (index > 1){
$("header").fadeTo("slow",1);
}
},
onLeave: function(index, nextIndex, direction){
if (index === 2 && direction === 'up') {
$("header").fadeTo("slow",0);
}
},

由于某种原因，它适用于标题。如果我用 #menu 替换所有“标题”，它仍然什么也不做。

显然将 #menu 更改为 ul 有效。

Answer 1

我将其添加到全页演示的 css 文件中 http://alvarotrigo.com/fullPage

.fp-viewing-firstPage #menu {
    visibility: hidden;
}

效果很好。显然您需要将 #menu 更改为 #Menu。