根据多卷活动元素

时间:2015-09-07 16:41:41

标签: jquery multiscroll.js

当第一个元素处于活动状态时,我尝试淡入.hello div,当第一个元素处于活动状态时,我尝试淡入淡出。

Multiscroll.js自动添加活动类。

有什么建议吗?感谢。

https://jsfiddle.net/oadfcjt2/7/

<div class="hello">HELLO</div>

<div id="myContainer">

    <div class="ms-left">
        <div class="ms-section firstelement" id="left1">
             <h1>Left 1 </h1>
        </div>

        <div class="ms-section" id="left2">
            <h1>Left 2 </h1>
        </div>
    </div>

    <div class="ms-right">
        <div class="ms-section firstelement" id="right1">
            <h1>Right 1</h1>
        </div>

        <div class="ms-section" id="right2">
            <h1>Right 2</h1>
        </div>
    </div>

</div>

1 个答案:

答案 0 :(得分:0)

根据docs,您可以使用afterLoad回调 启动隐藏在css中的hello div:

.hello {
    ...
    display: none
}

然后使用jQuery,fadeIn()fadeOut()根据可见索引(从1开始):

$('#myContainer').multiscroll({
    sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE'],
    menu: false,

    afterLoad: function(anchorLink, index) {
        if (index == 1)
            $('.hello').fadeOut('slow');
        else
            $('.hello').fadeIn('slow');
    }
});