如何使用JS淡入淡出/淡出

How to fade in fade/fade out with JS

本文关键字：淡出 淡入 JS 何使用      更新时间：2023-12-19

我正试图使用此脚本仅在"page1"、"page2"、"page 3"上显示我的#标题，但在"page4"上淡出，然后在"page5"上再次淡出

我的#footer目前运行良好，它隐藏在除"page5"之外的所有页面上，它会淡出其中。

<script type="text/javascript">
    $(document).ready(function () {
        $.fn.fullpage({
            anchors: ['page1', 'page2', 'page3', 'page4','page5'],
            slidesColor: ['#000', '#000', '#000', '#000', '#000'],
            'scrollOverflow': true,
            css3: true,
            fixedElements: '#header, #footer',
            afterRender: function () {
                $('#footer').hide();
                $('#header').show();
            },
            afterLoad: function (anchor, index) {
                if (index == 1, 2, 3, 4) {}
                $('#footer').fadeOut();
                if (index == 5) {
                    $('#footer').fadeIn();
                    }
                    if (index == 4) {}
                $('#header').fadeOut();
                if (index == 1, 2, 3, 5) {
                    $('#header').show();
                }
            }
        });
    });
</script>

http://jsfiddle.net/Q79kF/

谢谢你的帮助。。。

好的。。你写的顺序可能有问题。。根据您提供的代码，我相信这可能是您的问题。

标头在1,2,3中可见。。在4点淡出。。在5时淡入页脚在1,2,3,4中不可见。。但在5 时淡入

尝试

            //if (index == 1, 2, 3, 4) {} //You dont need this anyway
            if(index == 1, 2, 3){
                $('#header').show(); //try using .css('display','block') if show() didnt work
                $('#footer').hide(); //try using .css('display','none') if hide() didnt work
            }
            if(index == 4){
                $('#header').fadeOut();
            }
            if(index == 5){
                $('#header').fadeIn();
                $('#footer').fadeIn();
            }

试着调整一下。。这就是我所理解的。。如果我错了，请告诉我，我会尽力帮助你的。。

相关文章：