当body具有使用fullpage.js的类时隐藏或显示元素

提问者：小点点

当body具有使用fullpage.js的类时隐藏或显示元素

为了解决我的问题，我找了很多地方。我正在本地使用fullpage.js库构建一个网站。fullpage.js为body提供了一个类，这个类引用了Viewport中的部分。在最后的第二节中，我用下面的css代码隐藏了虚线滑块导航。我做了一个简化的html结构。

<body>
    <div class="section-1">
      .. some content
    </div>
    <div class="section-2">
      .. some content
    </div>
    <div class="section-3">
      .. some content
    </div>
    <div class="section-4">
      .. some content
    </div>
    <div class="section-5">
      .. slider with the navigation turned off when this section is in viewport, see used css.
    </div>
    <div class="sectie-footer">
      .. footer, navigation above reappears because this section is in viewport and css doesn't apply anymore; Body has now class fp-viewing-section-footer.
    </div>
</body>

CSS：

CSS that applies to sectie-5 but not when footer is in viewport.

body.fp-viewing-section-5-0 .fp-slidesNav.fp-bottom {
  display:none;
}

一切正常，但当试图编写一小段jQuery代码时，当sectie-footer在viewport中，并且body具有引用footer的类时，它会在sectie-5上隐藏这个导航元素。我不能让它工作。它没有显示错误，但代码并没有像我想的那样。

我试着检查body.hassClass,如果是,则添加一个带有.addClass的类。我试过。隐藏和。展示，也没有效果。我写道：

jQuery(document).ready(function() {
function hideonfooter() {
    jQuery('.fp-slidesNav.fp-bottom').hide();
  };

if (jQuery('body').hasClass('.fp-viewing-section-footer')) {
    hideonfooter();
}});

和我在前面关于Stackoverflow的问题中找到的一些代码（类jsnoshow有display：none）：

jQuery("fp-slidesNav").toggleClass(function() {
    if ( jQuery("body").hasClass( "fp-viewing-section-footer" ) ) {
        return "jsnoshow";
    } else {
        return "";
    }
});

我也试过：

jQuery(document).ready(function() {

if (jQuery('body').hasClass('.fp-viewing-section-footer')) {
        .hide('.fp-slidesNav .fp-bottom');
}});

希望你们能帮我。

共1个答案

匿名用户

请检查如何使用fullpage.js状态类或回调。

另外，不要忘记检查examples文件夹中的回调示例。

你可能还想检查这个视频教程，我做了利用国家类创建动画。

例如：

new fullpage('#fullpage', {
    afterLoad: function(origin, destination, direction){
        if(destination.index == 4){
            alert("Section 4 ended loading");
        }
    }
});

您可以在回调中使用所需节的索引，在所需节上运行代码，而不是警报。