fullpage.js如何将固定菜单附加到第二部分

默认情况下，菜单出现在每个页面上。我想让菜单不出现在第一页上。我做了以下操作：fullpage.js如何将固定菜单附加到第二部分

$('#fullpage').fullpage({ 
    verticalCentered: true, 
    scrollingSpeed: 600, 
    css3: true, 
    onLeave: function(index, nextIndex, direction){ 
     if (index == 2 && direction == 'up'){ 
      $('#menu').css('visibility','hidden'); 
     } 
    }, 
    afterLoad: function(anchorLink, index){ 
     if (index == 2){ 
      $('#menu').css('visibility','visible'); 
     } 
    }

现在，当我滚动到第二页并隐藏了滚动到第一页时出现的菜单。但这样菜单不是第二页的一部分，它只是根据位置改变可视性。

我想要以下内容：当它滚动到第一页时，菜单应该停留在第二页上。相反，当它从第一页滚动到第二页时，菜单应该在第二页上。

P.S.现在在html中，菜单放置在整个页面包装器之外。

P.P.S.该网站将有两个以上的页面，我想将菜单附加到窗口的顶部。

P.P.P.S.我做了我想要的。但它工作不好 - http://jsfiddle.net/a3dw6p4w/

来源

2014-10-20 Roman

我想要以下内容：当它滚动到第一页时，菜单应该停留在第二页。

使用菜单的固定位置。这对CSS，而不是jQuery的一件事：

#menu{ 
    position:fixed; 
    top: 30px; 
    left: 30px; 
    z-index:999; 
}

来源

2014-10-20 13:36:08 Alvaro

我的错误，在我的问题中，我忘了告诉一个重要的细节 - 网站将有两个以上的页面，我想让菜单出现在所有页面上，并将其附加到窗口的顶部。 – Roman 2014-10-20 14:21:14

你试过我的解决方案吗？这将解决问题。它是固定的。 – Alvaro 2014-10-20 14:29:38

它不起作用。该菜单仅在第二页上。当我滚动到第三页时，菜单停留在第二页上。 – Roman 2014-10-20 14:31:55

这里是你如何能做到这一点：

的Javascript

<script> 
    $(document).ready(function(){ 
    $('#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); 
     } 
    } 
    }); 
    }); 
</script>

它说，如果在页面加载，如果您滚动到部分（索引> 1），则菜单将慢慢淡入。

然后，如果从第二部分向上滚动（即到第1部分），它将慢慢淡出。

来源

2016-02-05 23:54:13 erwanc

fullpage.js如何将固定菜单附加到第二部分

回答

相关问题