我擁有了一切工作只是我的菜單和定位點很好,但加入如下代碼的鏈接停止工作後:錨點使用全頁onLeave不工作
$('#fullpage').fullpage({
onLeave: function(index, nextIndex, direction){
var leavingSection = $(this);
//after leaving section 2
if(index == 1 && direction =='down'){
$('header').addClass('active');
}
else if(index == 2 && direction == 'up'){
$('header').removeClass('active');
}
}
});
我的目的是爲了隱藏我的頭,只在第二部分後顯示,發生這種情況,但錨點不再工作。
我的頭HTML
<header>
<ul id="myMenu">
<li data-menuanchor="topo" class="active"><a href="#topo"><img src="img/dcb-white.svg"></a></li>
<li data-menuanchor="contato"><a href="#contato">Contato</a></li>
<li data-menuanchor="sobre"><a href="#sobre">Sobre Mim</a></li>
<li data-menuanchor="historico"><a href="#historico">Histórico</a></li>
<li data-menuanchor="portfolio"><a href="#portfolio">Portfolio</a></li>
<li data-menuanchor="topo" class="active"><a href="#topo">Topo</a></li>
</ul>
</header>
頁眉CSS
header{
position:fixed;
height: auto;
display:block;
width: 100%;
background: #000;
z-index:9;
text-align:center;
color: #fff;
top:0px;
visibility: hidden;
opacity: 0;
-webkit-transition: all 0.8s;
-moz-transition: all 0.8s;
transition: all 0.8s;
}
header.active {
visibility: visible;
opacity: 1;
-webkit-transition: all 0.8s;
-moz-transition: all 0.8s;
transition: all 0.8s;
}