第一次使用锚点时,fullpage.js onLeave无效

时间:2015-11-24 06:39:33

标签: jquery html fullpage.js

好的,我在fullpage.js遇到了一个非常奇怪的问题。 这是我的代码:

$('#fullpage').fullpage({
        onLeave: function(index, nextIndex, direction){                
            if (index == 1 && direction =='down') {               
                $('.titlea').hide("slide", { direction: "right" }, 300, function(){$('.titleb').hide("slide", { direction: "right" }, 200);});
            } else if (index == 2 && direction =='down' || index == 2 && direction =='up') {
                $('.aboutme').hide("slide", { direction: "left" }, 200);
            } else if (index == 3 && direction =='down' || index == 3 && direction =='up') {
                $('.menume').hide("slide", { direction: "left" }, 100);
                $('.rubrika1').hide("slide", { direction: "up" }, 300, function(){$('.rubrika2').hide("slide", { direction: "down" }, 200);});
                $('.rubrika3').hide("slide", { direction: "up" }, 300, function(){$('.rubrika4').hide("slide", { direction: "down" }, 200);});
            }
        },
        afterLoad: function(anchorLink, index){
            if (index == 1){
                $('.titlea').show("slide", { direction: "right" }, 200, function(){$('.titleb').show("slide", { direction: "right" }, 200);});               
            } else if (index == 2) {
                 $('.aboutme').show("slide", { direction: "left" }, 200);
            } else if (index == 3) {
                $('.menume').show("slide", { direction: "left" }, 200);
$('.home').delay(100).show("slide", { direction: "left" }, 200);
                $('.rubrika1').show("slide", { direction: "up" }, 300, function(){$('.rubrika2').show("slide", { direction: "down" }, 200);});
                $('.rubrika3').show("slide", { direction: "up" }, 300, function(){$('.rubrika4').show("slide", { direction: "down" }, 200);});
            }
        }   

    });
菜单部分的

和html:

<ul id="myMenu" class="menume">
<a href="#firstPage"><div data-menuanchor="firstPage" class="home"></div></a>
</ul>


<div id="fullpage">
<div class="section">blah blah blah</div>
<div class="section">blah blah blah</div>
<div class="section">blah blah blah</div>
<div class="section">blah blah blah</div>
</div>

所以问题是,当我点击带有#firstPage锚点的菜单按钮时,它会根据需要将我链接到第一部分,但onLeave动画不起作用。单击锚点时应该隐藏的所有元素都会保留。而且,在第一部分的载荷也没有显示第一部分的动画之后,当我点击它的锚点时。

如果我向下或向上滚动 - 所有动画都有效。现在这里是最奇怪的部分,在我点击那个锚点并且动画不起作用之后,当我向下滚动并再次点击该锚点时 - 一切都开始正常工作。所有元素都会根据需要进行动画制作并隐藏/显示。会是什么呢?为什么锚链接不是第一次触发动画,而是稍后触发它?

1 个答案:

答案 0 :(得分:0)

好的,我通过启用lockAnchors解决了一个问题:在插件设置中为true。